Unordered List item <Li>'s not able to retain class when given programatically
<p>Asalamualikum(May Peace be on you) , My Problem is that I am trying to change the class of li item when its  item is clicked . I succeed in that but problem is that class is given to li item but its not able to retain class.</p>

<p>My html and jquery is like this </p>

<pre><code>$(document).ready(function () {


                //On Click Event
                $("ul.tabs li").click(function () {

                    $("ul.tabs li").removeclass("active"); //Remove any "active" class
                    $(this).addClass("active"); //Add "active" class to selected tab



                });
            });

        &lt;/script&gt;

    &lt;div class="menu_nav"&gt;
                      &lt;ul class="tabs"&gt;
                            &lt;li&gt;&lt;a href="default.aspx"&gt;&lt;span&gt;Home Page&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                            &lt;li&gt;&lt;a href="support.aspx"&gt;&lt;span&gt;Support&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                            &lt;li&gt;&lt;a href="aboutus.aspx"&gt;&lt;span&gt;About Us&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                            &lt;li&gt;&lt;a href="services.aspx"&gt;&lt;span&gt;Services&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                            &lt;li&gt;&lt;a href="contactus.aspx"&gt;&lt;span&gt;Contact Us&lt;/span&gt;&lt;/a&gt;&lt;/li&gt;
                        &lt;/ul&gt;
                    &lt;/div&gt;
</code></pre>
