CODEWITHSUNDEEP
jquery
John Hallow
John Hallow

Reputation: 3

jQuery selector not excluding :not

I'm trying to use the jquery selector 

"body *:not(.class)"

to bind events to everything on the page except a given class (see http://jsfiddle.net/MMrRb/)

When I do it, the :not clause is being ignored. Does anyone know why this is? My only way to hack around it is a separate jquery clause to reverse out what's being applied by "*"

Upvotes: 0

Views: 59

Answers (2)

Arun P Johny
Arun P Johny

Reputation: 388316

It is because the style is applied to the ul element also, and the two is a child of the ul so the css rule is inherited by the element

My solution will is to apply the rule to only the leaf nodes, try the below solution

$(function() {
    $("body :not(.two):not(:has(*))").css("color", "red");
});

Demo: Fiddle

Note: It is going to be incredibly costly... so if you get any other solution opt for it after a cost analysis

Upvotes: 0

James Montagne
James Montagne

Reputation: 78650

It is working just fine. If you inspect the DOM in your fiddle, you will see that your .two element does not have a style of color: red. However, your ul does. Since your .two is in your ul it inherits the color.

That being said, the * in your selector is unneeded. You can remove it and it will still select the same elements.

Upvotes: 5

Related Questions