CODEWITHSUNDEEP
jqueryjquery-selectors
sebpiq
sebpiq

Reputation: 7812

Make a query, but ignore children of a given element even if they match

I have this html :

<div id="container1">

    <div id="container3">
        <div class="item"></div>
        <div class="item2"></div>
    </div>

    <div class="item"></div>
    <div class="item2"></div>

    <div id="container2">
        <div class="item"></div>
        <div class="item"></div>
        <div class="item2"></div>
    </div>

<div>

With jQuery, is there a (simple) way to search for divs with .item, but masking all the results inside #container2?

Ideally I'd like something like $(#container1).mask('container2').find('.item'), i.e. a transparent solution that you could use with any other query, without knowing that you are using it. For example :

// where queryExcludingContainer2 could be `$(#container1).mask('container2')` if the `mask` function existed
queryExcludingContainer2.find('.item')
queryExcludingContainer2.find('.item2')

Is there such a "masking" feature?

Upvotes: 1

Views: 60

Answers (5)

Eloims
Eloims

Reputation: 5224

You can use the ":not" selector http://api.jquery.com/not-selector/

$('.item:not(#container2 *)')

Upvotes: 1

Kilian Stinson
Kilian Stinson

Reputation: 2394

You mean something like this?

jsFiddle example

$('div').not('#container2').children('.item')

For more Information: jQuery API Documentation of not()

Upvotes: 2

Miklos Aubert
Miklos Aubert

Reputation: 4585

I think you need to use children()

Example JS Fiddle.

$("#container1").children(".item").css('font-style', 'italic');

Upvotes: 1

Moritz Petersen
Moritz Petersen

Reputation: 13057

I think you can use filter().

Upvotes: 0

jeyraof
jeyraof

Reputation: 893

I think, you can use space-bar like this:

$('#container1 .item')

And, if .item element was under the #container1 directly, you can also use this:

$('#container1 > .item')

Upvotes: 0

Related Questions