CODEWITHSUNDEEP
jquery
Vahn
Vahn

Reputation: 542

How to exclude a class from selection using jQuery?

I have this HTML element structure.

    <div class="parent">
       <div class="myChild">A</div>
       <div class="myChild">B</div>
   </div>

   <div class="parent">
       <div class="myChild notYou">C</div>
       <div class="myChild">D</div>
   </div>

How do get all class myChild inside class parent but exclude the one with the class notYou from my selection? I use this script:

$(".parent").not(".parent + .notYou").each(function(i){
//something
});

But, the class notYou is still included.

Upvotes: 0

Views: 282

Answers (2)

Lokesh Suman
Lokesh Suman

Reputation: 503

You are not using the not method correctly. You can select the elements for this scenario either using the not method or the :not selector.

$('.parent .myChild:not(.notYou)'); // :not selector

or

$('.parent .myChild').not('.notYou'); // .not method

$(".parent .myChild").not(".notYou").each(function(i){
   console.log($(this).html())
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="parent">
       <div class="myChild">A</div>
       <div class="myChild">B</div>
   </div>

   <div class="parent">
       <div class="myChild notYou">C</div>
       <div class="myChild">D</div>
   </div>

Upvotes: 1

Alen.Toma
Alen.Toma

Reputation: 4870

I understand that you want all .mychild classes except .notYou.

Here is how you could get that:

$(".parent > .myChild:not(.notYou)").each(function(i){
   console.log($(this).html())
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="parent">
       <div class="myChild">A</div>
       <div class="myChild">B</div>
   </div>

   <div class="parent">
       <div class="myChild notYou">C</div>
       <div class="myChild">D</div>
   </div>

Upvotes: 1

Related Questions