Question

I’m looking for a function to apply a class to all links except the one clicked.

css

.foot_active {
    text-decoration:underline;
}
.foot_inactive {
    text-decoration:none;
}

html

<div class="sitemap">
    <table class="table_site">
        <tr>
            <td class="subsite"><a>op1</a></td>
            <td class="subsite"><a>op2</a></td>
            <td class="subsite"><a>op3</a></td>
        </tr>   
    </table>
</div>

script

$('a:contains("op1")')
    .live('click', function(){
        $(this).addClass('foot_active');
        $('a:not(.foot_active)').addClass('foot_inactive');
    });
$('a:contains("op2")')
    .live('click', function(){
        $(this).addClass('foot_active');
        $('a:not(.foot_active)').addClass('foot_inactive');
    });
$('a:contains("op3")')
    .live('click', function(){
        $(this).addClass('foot_active');
        $('a:not(.foot_active)').addClass('foot_inactive');
    });

This script only works for first time you click in link, but not for future clicks.
I think I’m doing something wrong, but my brain seems to be so mad right now.

Thank you.

Answer 1

for all links inside td with class called .sitemap you could try:

$('.sitemap a') .live('click', function(){
  $(this).addClass('foot_active');
  $('.sitemap a').not(this).removeClass('foot_active');
});