CODEWITHSUNDEEP
javascriptjquery
PhilG
PhilG

Reputation: 13

removeClass does not work

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");
    });
});

Upvotes: 1

Views: 160

Answers (3)

Nix
Nix

Reputation: 58622

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.

Upvotes: 2

nnnnnn
nnnnnn

Reputation: 150070

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.

Upvotes: 1

Carlos Nuñez
Carlos Nuñez

Reputation: 470

Do it like this:

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

Upvotes: 1

Related Questions