banner, slider.

banner, slider.

Hello -
I'm trying to do the following in plain english.

When '#next' clicked, hide current 'li' element, and display the next.
IF 'li:last' - rewind / 'show()' first li again.

here is what i have so far.. please provide me with explanation to what's being done with your suggested approach. (also explain if possible, what was wrong on my end.)

Thanks in advance!

  1. $('a#next').click(function() {   
  2.         var curlistItem = $('li:visible'); // find our 'visible' li element, and assign it to variable
  3.         var nextlistItem = curlistItem.next(); // take the 'visible' element, and append the 'next' element
  4.        
  5.         curlistItem.hide(); // hide the visible element
  6.         nextlistItem.show(); // show the next element
  7.        
  8.         if (nextlistItem.is('li:last')) { //if last 'li' element,
  9.         //restart, rewind, bring back to first 'li'
  10.         alert ('this should only display if current list item last element');
  11.         }   
  12.     });