Hi Michael, Try this. It uses the index of the <a> within the <div> and then removes the class from all <a> elements equal or greater than it. The code is a bit cumbersome but I think it works.
<div id="links"> <a href="#" class="star_selected">lorem ipsum</a> <a href="#" class="star_selected">lorem ipsum</a> <a href="#" class="star_selected">lorem ipsum</a> <a href="#" class="star_selected">lorem ipsum</a> <a href="#" class="star_selected">lorem ipsum</a> </div> $('#links a').click(function(){ $('a:gt('+($("#links a').index(this)-1)+')').removeClass ('star_selected'); return false; }); Paul On Dec 12, 12:39 pm, Reepsy <mre...@gmail.com> wrote: > This might sound naive, but I expected this to work: > > $(this).nextAll('a').andSelf().removeClass > ('star_selected').triggerHandler('mouseout'); > > It's from a star rating I wrote, where I have 5 <a> tags in a row. If > you click on one it removes a class from it and all that follow it, > and then fires the mouseout event. This works perfectly for stars 1-4, > but fails on #5, because there is no next. But I did not expect it to > ignore the rest of the chain. Everything after .nextAll is ignored. If > I break this into two lines, it works fine: > > $(this).nextAll('a').removeClass('star_selected'); > $(this).removeClass('star_selected').triggerHandler('mouseout'); > > But I am repeating myself with the removeClass. Can anyone see a way > to combine these back into one statement? The mouseout has to go last. > > Michael