change class on LI click
<p>I need to dinamically assign a .selected class to the element where I click and also remove any other previous class asigned to the clicked element so I can change CSS class. Maybe this code:</p>

<pre><code>$(this).click(function(){
  $(this).addClass('selected');
});
</code></pre>

<p>works but what happend if I click in any other LI? Any help to get this work?</p>

<p>EDIT:
Ok see this code:</p>

<pre><code>&lt;ul&gt;
  &lt;li&gt;Item 1&lt;/li&gt;
  &lt;li&gt;Item 2&lt;/li&gt;
  &lt;li&gt;Item 3&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>By default none have any classes but I click in Item 2 then the HTML should transform on this one:</p>

<pre><code>&lt;ul&gt;
  &lt;li&gt;Item 1&lt;/li&gt;
  &lt;li class="selected"&gt;Item 2&lt;/li&gt;
  &lt;li&gt;Item 3&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>but once again if I click in Item 3 then the HTML should transform on this one:</p>

<pre><code>&lt;ul&gt;
  &lt;li&gt;Item 1&lt;/li&gt;
  &lt;li&gt;Item 2&lt;/li&gt;
  &lt;li class="selected"&gt;Item 3&lt;/li&gt;
&lt;/ul&gt;
</code></pre>

<p>This is what I'm trying to do</p>
