Question

Hey all. Basically, I want the the next image to be clicked using jquery every second:

jQuery:

 var i=1;

 setInterval(function() {
  $(".portfolio :nth-child("+i+")").click();
  if (i<5) {i++;} else {i=1;}

 }, 1000);

HTML:

<div class="portfolio"> 
  <ul> 
   <li><img src="images/4.jpg" alt="4" id="promo_one"></li> 
   <li><img src="images/1.jpg" alt="1" id="promo_two"></li> 
   <li><img src="images/2.jpg" alt="2" id="promo_three"></li> 
   <li><img src="images/3.jpg" alt="3" id="promo_four"></li> 
  </ul> 
 </div> 

Thanks in advance 🙂

Answer 1

Instead of :nth-child() you can use .eq() here, like this:

var i=1;
setInterval(function() {
  $(".portfolio ul li img").eq(i).click();
  i = i==3 ? 0 : i + 1;
}, 1000);

Your selector should also go down to the <img> (or leave out the img part if you want to click the <li>), otherwise you’re clicking other elements as well. This gets all images, and grabs the one at the index you want using .eq(index) so you can .click() it.