Hi all,

I am working on with Generating xml content via html and a list of menus say eg x1,x2,x3 are coming from xml or json and i am calling it inside my html by inserting a single a tag using Jtemplate. My code is something like this.

<a href="#" id="#" onClick = "activeLink(this);">{$T.name}</a>

so now it generates all the names from xml to the html template and now my issue is .. i have written a javascript for highlighting the menu for which menu is clicked. so the first menu say x1 is highlighted when it is clicked. and i have written this javascript like this.

function activeLink(id)
{
$(id).parent().toggleClass('active');
}

Now what happens is my first menu ie x1 is getting highlighted with a background color which i have written for active css and when i click second menu x2 ..then x2 is also getting highligted but x1 should be removed from its active class. Now both are getting the active css class. How do i write a javascript to remove the active class for the rest and keep the active class only for one menu.

Please help me in this.

Thanks