There is a markup:

<div class="wrapper"> <div id="main-slide"> <img src="http://dummyimage.com/650x400/8a8a8a/fff" alt=""> </div> <div id="slide-bar"> <ul> <li><a href=""><img src="http://dummyimage.com/100x100/858111/fff" alt=""></a></li> <li><a href=""><img src="http://dummyimage.com/100x100/858222/fff" alt=""></a></li> <li><a href=""><img src="http://dummyimage.com/100x100/858333/fff" alt=""></a></li> <li><a href=""><img src="http://dummyimage.com/100x100/858444/fff" alt=""></a></li> <li><a href=""><img src="http://dummyimage.com/100x100/858555/fff" alt=""></a></li> </ul> </div> </div> 

How can I get a click on li elements using javascript?

This code does not work:

 var some = document.getElementById('slide-bar').getElementsByTagName('ul')[0].getElementsByTagName('li'); some.onclick = function(){}; 
  • You have not done 1) loop, 2) are not in the ul subdirectory (firstChild). - nick_n_a
  • What does it mean to pick up? Subscribe to an event? Select all items. Go through all the elements and add the event addEventListener('click', function (){/*Ρ‡Ρ‚ΠΎΡ…ΠΎΡ‚ΠΈΡ‚Π΅Π΄Π΅Π»Π°Ρ‚ΡŒΠΏΡ€ΠΈΠΊΠ»ΠΈΠΊΠ΅*/}) - Vasily Barbashev
  • It must be done so that when clicking on any of the "li" the same action takes place. - Kardanx

1 answer 1

https://plnkr.co/edit/YDViqpOH2Zm0MRouUvPZ?p=preview

 document.addEventListener("click", // здСсь повСсили ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ Π½Π° вСсь Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ ΠΈ Π½Π° всС ΠΊΠ»ΠΈΠΊΠΈ function(e) { e.preventDefault(); if (e.target.hasAttribute("data-slider")) { // здСсь нСпосрСдствСнно Π»ΠΎΠ²ΠΈΠΌ ΠΊΠ»ΠΈΠΊ ΠΏΠΎ Π½ΡƒΠΆΠ½ΠΎΠΌΡƒ элСмСнту alert('Бпасибо!') } }); 

Just so that the click will work out correct some css styles and assign it to the li {display: block} element or catch a click on the link itself (tag a). Well, what is convenient with this approach is the fact that the rest of the events can be immediately filtered.