title: Get the index position of an li with a specific class using jquery
body: <p>I'm trying to get jquery to return the index position of the top level li with a class of .open. EG:</p>
  
  <pre><code>&lt;ul&gt;
    &lt;li class="open"&gt;something
       &lt;ul&gt;
          &lt;li&gt;ignore this&lt;/li&gt;
          &lt;li&gt;ignore this&lt;/li&gt;
       &lt;/ul&gt;
    &lt;/li&gt;
    &lt;li&gt;something&lt;/li&gt;
    &lt;li class="open"&gt;something&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>So in the case of the above, I want it to ignore anything below the second ul. And return the index position of the top level (IE. ul li siblings only) with the class of .open.</p>
  
  <p>So the above would return:
  0 and 2</p>
  
  <p>I've tried this:</p>
  
  <pre><code>console.log($('ul:first li.open').index());
  </code></pre>
  
  <p>But this returns odd results. I've also tried this:</p>
  
  <pre><code>$('ul:first li.open').each(function(){
     console.log($(this).index());
  }
  </code></pre>
  
  <p>But again this doesn't return the expected results. </p>
  
  <p>Thanks.</p>