Get index value of an item with a specific class
<p>I am trying to figure out how to get an index value of an element with a given class. For example, I have.</p>

<p><strong>HTML:</strong></p>

<pre><code>&lt;ul&gt;
    &lt;li&gt;One&lt;/li&gt;
    &lt;li&gt;Two&lt;/li&gt;
    &lt;li class="open"&gt;Three&lt;/li&gt;
    &lt;li&gt;Four&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p><strong>jQuery</strong></p>

<pre><code>var index = $('li .open').index();
console.log(index);
</code></pre>

<p><strong>What I expect:</strong></p>

<p>Console result expected should equal <strong>2</strong>. What I get is <strong>-1</strong>.</p>

<p>Anyways, I am obviously doing something wrong so any help with this would be much appreciated. I started a fiddle here: 
<a href="http://jsfiddle.net/gENcn/" rel="nofollow">http://jsfiddle.net/</a></p>
