Do not add class if specific class exists

Question

My navigation highlights the section of the page the visitor is on and changes as they scroll by adding .active-nav to ANY href that points to that section of the page. I have an image sprite that points to #foo but I don't want .active-nav added to that anchor tag. I am having no luck implementing the :not selector. I fear I have spent too much time on this and cannot see the obvious answer.

I would like to have the following code ignore an href tag if a specific class (.bar) already exists. Please advise.

if ( windowpos > $('#foo').offset().top) {
$('nav li a').removeClass('active-nav');
$('a[href$="#foo"]').addClass('active-nav');
}

sorry, my op did not make clear that my code example does not contain my attempt to solve the problem. all of my attempts have failed. — LyleCrumbstorm, Apr 02 '15 at 21:07
related: http://stackoverflow.com/questions/8266662/add-class-via-jquery-but-only-when-not-exists — Michael Doye, Apr 02 '15 at 21:08
Do you need to check if an element has `.bar` class in the entire page before this code runs? — Batu.Khan, Apr 02 '15 at 21:11

score 4 · Accepted Answer · answered Apr 02 '15 at 21:09

4

You can use the not() function:

$('a[href$="#foo"]').not('.bar').addClass('active-nav');

answered Apr 02 '15 at 21:09

BenM

52,573
26
113
168

score 0 · Answer 2 · answered Apr 02 '15 at 21:12

0

How about this:

if($('a[href$="#foo"]').hasClass("bar")){
   //do stuff
} else {
   $('a[href$="#foo"]').addClass('active-nav');
}

answered Apr 02 '15 at 21:12

renakre

8,001
5
46
99

1

this is very helpful too. – LyleCrumbstorm Apr 02 '15 at 21:19

Do not add class if specific class exists

2 Answers2