Question

I have made a simple image slideshow using jQuery. I need the “next” button to execute exactly the same function I use on each image click above. Since I am noobie, I can’t get the issue.

Demo

$('.show').each(function(){
      var $this = $(this);
      $this.children('li').hide().eq(0).show();

      var activeli = $this.find('li');

      activeli.click(function() {
              var $this = $(this);
              var $next = $this.next();
              if ($next.length === 0) {
                      $next = $this.parent().children(':first');
              }
              $this.hide();
              $next.show();
      });

      // My issue is there
      $('.next').click(function() {
              activeli.click();
      });

});

Answer 1

You may want to filter what activeli will be clicked but:

$('.next').click(function() {activeli.filter(":visible").trigger("click");}

is the basics, note that you dont need to wrap activeli with jquery because you have it already when you find the li in the first place.