Get The Exact Element That Was Clicked In jQuery
<p>I have a <code>UL</code> list and I want to change the class of each the element clicked.. easy enough but when I use sub categories? <code>ul</code> lists within <code>li</code> elements and use code like this:</p>

<pre><code>&lt;ul class="options"&gt;
    &lt;li&gt;option 1&lt;/li&gt;
    &lt;li&gt;option 2
        &lt;ul&gt;
            &lt;li&gt;option 2.1&lt;/li&gt;
            &lt;li&gt;option 2.2&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/li&gt;
&lt;/ul&gt;
&lt;script&gt;
$(".options li").click(function(){
    $(this).toggleClass("chose");
});
&lt;/script&gt;
</code></pre>

<p>And a lot of CSS to take care of the rest.</p>

<p>It changes the class of the main <code>li</code> element that the <code>ul</code> list is hosted in but I only want it to change the class of the exact element in the sub list.</p>

<p>How could I do this so that the parent <code>li</code> class does not change but only the actual list item clicked. But also allow the parent <code>li</code> element to be selected directly too?</p>
