title: jquery: target nth instance of class when it isn't the only class of div
body: <p>I have a list of similar div's which all have class <code>a</code> assigned to them and some have <code>a</code> AND <code>b</code> classes. </p>
  
  <p>I want to find out the <code>b</code> index of the currently selected div.</p>
  
  <p>If both classes exist, the index returned is of the "like" class <code>a</code> and not of the class I'm looking for <code>b</code>.</p>
  
  <p>The div's look like this</p>
  
  <pre><code>&lt;div class="a"&gt;
      &lt;div class="clicker"&gt;1st&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="a b"&gt;
      &lt;div class="clicker"&gt;2nd (1st instance of class b - index 0)&lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="a"&gt;
      &lt;div class="clicker"&gt;3rd&lt;/div&gt; 
  &lt;/div&gt;
  &lt;div class="a b"&gt;
      &lt;div class="clicker"&gt;4th (2nd instance of class b - index 1)&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and I'm targeting them like this</p>
  
  <pre><code>$(".clicker").click(function(){
      var yi = $(this).closest(".b").index();
      // yi should have the index of .b
  });
  </code></pre>
  
  <p>How can find the index of just <code>b</code>?</p>
  
  <p><a href="http://jsfiddle.net/zgn1fv47/4/" rel="nofollow">http://jsfiddle.net/zgn1fv47/4/</a></p>