jQuery delete class elements except with a certain ID

Question

I need to hide() all class level elements of '.dd-container' except when that element has an id of '#tools'.

I tried the following (which didn't work) but I'm pretty sure I fudged the syntax:

$('div:has(.dd-container):not(#tools .dd-container)').hide();

Answer 1

I think this should work:

$("div:not(#tools)").find(".dd-container").hide();

edit: Think I mis-read the question. Is there one dd-container-class that also has an id of tools? If so, then you need to change it to this:

$("div").find(".dd-container:not(#tools)").hide();

or this: (Which should perform faster according to some tests I did a while back)

$(".dd-container:not(#tools)", "div").hide();

The reason it's faster, is because it's looking for the classes first, instead of looking for all divs, and then going through them all...I think.

Answer 2

#tools .dd-container

there is a blank between #tools and .dd-container that means all children of #tools with the class .dd-container e.g.

<table id="tools"><tr class='dd-container'>

so #tools.dd-container should work however the answer of peirix is much easier to read.

Answer 3

$('div:has(.dd-container):not(#tools.dd-container)').hide();

(Note the lack of space after '#tools') or

$('div:has(.dd-container):not(#tools)').hide();

(As ids are unique, you can probably dispense with the class specifier for the 'not' selector)