Question

Being jQuery noob I have a problem and I don’t know how to solve it:(
I have ul tag and couple li tags inside it.
And I am trying to accomplish this : on first click of a button select first li tag, on second click select second li tag and so on…
You can see that this is not working as expected (it selects first and second tag).
Can someone help me or point me in the right direction? Here’s jsFiddle link:http://jsfiddle.net/aH8w2/ Thank you!!!

<script type="text/javascript">
function addCss(){


$('ul li.first').addClass('red');

}

$(document).ready(function(){
$("button").click(function(){    
addCss();
});

$("button").click(function(){    
if($('ul li.first').is('.red'))
$('ul li.first').next('li').addClass('red'); 
});

});

</script>

Answer 1

Try this:

$("button").click(function(){    

  $('.red').removeClass('red').next('li').addClass('red');

});