Setting active class for navigation using javascript
<p>I am using PHP to echo my list of navigation options, this is being done due to different privileges for each user. The list is divided into groups which has a few more list items, one a user clicks on the heading of the group expands, listing the sub-menu. I have been able to set the active class for the menu which is currently open using this piece of javascript:</p>

<pre><code>function initMenu() {
    $('#menu ul').hide();
    $('#menu li a').click(function() {
        var checkElement = $(this).next();
        if((checkElement.is('ul')) &amp;&amp; (checkElement.is(':visible'))) {
        //slide up if visible (works fine).
        }
        if((checkElement.is('ul')) &amp;&amp; (!checkElement.is(':visible'))) {
        //otherwise slideDown (works fine too).
        }
    });
}

$(document).ready(function() {markActiveLink();initMenu();});

function markActiveLink() {
   $("#menu li ul li a").filter(function() {
       return $(this).prop("href").toUpperCase() == window.location.href.toUpperCase();
   }).addClass("active")
   .closest('ul') //some markup problem
   .slideDown('normal');
}
</code></pre>

<p>And this is my markup for list that are being displayed: </p>

<pre><code>echo "&lt;ul id='menu'&gt;";
 echo "&lt;li&gt;&lt;a href='#'&gt;Adminstration&lt;/a&gt;
&lt;ul&gt;&lt;li&gt;";
echo "&lt;a href='path_to_page/usermanagement.php'&gt;User Management&lt;/a&gt;";
echo "&lt;/li&gt;&lt;li&gt;";
// and some more items
</code></pre>

<p><strong>Here administration is my group heading and User Management is my sub-group.
Now using the above piece of code i am still not able to expand my menu on different pages, so that the user knows which page he is on?</strong></p>
