removeClass does not work

Question

I am trying for the life of me to figure out how to get it to remove a class when clicking another link. I want it so it only highlights the specific area selected but the remove class isn't removing the class. So it stays highlighted as specified in the class underNavselected. Can anyone assist?

This is all on one page, not linking to other docs. I am hiding and unhiding content with each click.

jQuery(document).ready(function() {
    jQuery(".toTop").hide();
    jQuery(".aboutHeader").hide();
    jQuery(".LAM").hide();
    jQuery(".WID").hide();
    jQuery(".MyG").hide();
    jQuery("#LAMlink").live("click", function()
    {
        jQuery(this).addClass("underNavselected");
        jQuery(".LAM").slideToggle(500);
        jQuery(".WID").hide();
        jQuery(".MyG").hide();
        jQuery("#MyGlink", "#WIDlink").removeClass("underNavselected");
    });
    jQuery("#WIDlink").live("click", function()
    {
        jQuery(this).addClass("underNavselected");
        jQuery(".WID").slideToggle(500);
        jQuery(".LAM").hide();
        jQuery(".MyG").hide();
        jQuery("#LAMlink", "#MyGlink").removeClass("underNavselected");
    });
    jQuery("#MyGlink").live("click", function()
    {
        jQuery(this).addClass("underNavselected");
        jQuery(".MyG").slideToggle(500);
        jQuery(".LAM").hide();
        jQuery(".WID").hide();
        jQuery("#LAMlink", "#WIDlink").removeClass("underNavselected");
    });
});

Answer 1

You incidentally used a descendant selector your code was equivelent to "#LAMlink #WIDlink" which means you are looking for a WIDlink that has an ancestor of LAMlink

So the proper solution is to change:

jQuery("#LAMlink", "#WIDlink")

to

jQuery("#LAMlink, #WIDlink")

Notice mine is all the same string.

Answer 2

Do it like this:

jQuery("#MyGlink, #WIDlink").removeClass("underNavselected");

Answer 3

Change this:

  jQuery("#MyGlink", "#WIDlink").removeClass("underNavselected");

To this:

  jQuery("#MyGlink, #WIDlink").removeClass("underNavselected");

And similar in each place that you do that.

The selector should be a single string with commas in it. The way you had it jQuery will look for elements matching the first selector that are descendents of elements matching the second selector.