title: Understanding jQuery each loop
body: <p>I have the following code:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="sectionInner"&gt;&lt;div class="carousel"&gt;&lt;/div&gt;&lt;/div&gt;
  &lt;div class="sectionInner"&gt;&lt;/div&gt;
  &lt;div class="sectionInner"&gt;&lt;/div&gt;
  &lt;div class="sectionInner"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>function checkForCarousel() {
      $('.sectionInner').each(function(i) {
          if($(this).has('.carousel')) {
              alert('We got a Carousel!');
          }
          else {
              alert('No Carousels here')
          }
      });
  }
  
  checkForCarousel();
  </code></pre>
  
  <p>What I am trying to do is loop over the four div.sectionInner if I find a child with class of carousel then I want to append some buttons. I know I can just target the carousel directly but this is part of a bigger picture and I do have a reason for wanting to use a loop.</p>
  
  <p>Anyway as the loop begins it alerts 'We got a Carousel' as you'd expect for the first div. It then carries on alerting 'We got a Carousel' when quite clearly we don't have Carousels for the other three divs. What am I doing wrong here?</p>