Count elements not containing certain class

Question

How can I count elements .em that do not have section with class .extra?

var cnt = $('.em').not('.extra').length;
console.log(cnt);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="em">
  <div class="header">aaa</div>
  <ul>nnn</ul>
</div>

<div class="em">
  <div class="header">aaa</div>
  <div class="extra">eee</div>
  <ul>nnn</ul>
</div>

<div class="em">
  <div class="header">aaa</div>
  <ul>nnn</ul>
</div>

Answer 1

You were negating .em elements with a class of .extra. Since none of the .em elements have the class .extra, all of them were selected.

One option would be to combine :not() with the :has() selector: .em:not(:has(.extra))

var cnt = $('.em:not(:has(.extra))').length;
console.log(cnt);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="em">
  <div class="header">aaa</div>
  <ul>nnn</ul>
</div>

<div class="em">
  <div class="header">aaa</div>
  <div class="extra">eee</div>
  <ul>nnn</ul>
</div>

<div class="em">
  <div class="header">aaa</div>
  <ul>nnn</ul>
</div>