Jquery navigation menu problem
<p>This could be the easiest of a problem, but sometimes my dumbness knows no bounds.</p>

<p>I am trying to create a simple navigation menu. On clicking a link in the navigation menu, it should turn into some different layout and stay like this. I am using this code of jquery,</p>

<pre><code>$(function()
{

    $(".top a").click(function()
    {
        $(this).parent().addClass('active').siblings().removeClass('active');
    };

});
</code></pre>

<p>and here is the menu, </p>

<pre><code>&lt;ul class="top"&gt;

&lt;li&gt;&lt;a href="http://example.com/index.php" class="home"&gt;&lt;/a&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href="http://example.com/page.php?id=1" class="charter"&gt;&lt;/a&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href="http://example.com/about_us.php" class="about"&gt;&lt;/a&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href="http://example.com/policy.php" class="policy"&gt;&lt;/a&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href="http://example.com/page.php?id=4" class="code"&gt;&lt;/a&gt;&lt;/li&gt;

&lt;li&gt;&lt;a href="http://example.com/humanitarian.php" class="human"&gt;&lt;/a&gt;&lt;/li&gt;

&lt;/ul&gt;
</code></pre>

<p>I assign class active to li tag whenever someone clicks on any link. But the class is lost on page load. Can someone suggest me how to keep the active class there and keep the link active after the page load. There seems to be something i am missing.</p>

<p>Thanks. </p>
