Question

I have the following code:

 <ul>
    <li class="tree">
    <span><a class="collapse" href="#">Collapse</a></span>
    </li>
    <li class="tree">
<span><a class="expand" href="#">Expand</a></span>
</li>
    </ul>

How can I add a class on the li to current when you click on the expand link and then take off the current when I click on the collapse in jquery?

Answer 1

$('.collapse').click(function(e){

    $(this).closest('li').removeClass('current');

});

$('.expand').click(function(e){

    $(this).closest('li').addClass('current');

});

if you need to stop the anchor going to the link, use:

e.preventDefault()

before the class add/removal.