Question: I have a menu: <http://jsfiddle.net/hu5x3hL1/3/>

**HTML**

```
<ul id="menu" class="sidebar">
<li> <a href="#" class="clickme">Menu</a>
    <ul id="menu1">
        <li><a class="dropdown-class-name" href="#">Dropdown link1</a></li>
        <li><a class="dropdown-class-name" href="#">Dropdown link2</a></li>
    </ul>
</li>

```

**jQuery**

```
    $('#menu1 li a').click(function(e) {
    $('a').removeClass('dropdown-class-name active');
    $(this).addClass('dropdown-class-name active');
});

```

**CSS**

```
#menu1 li a.active{
    font-weight:bold;
}

```

Active menu item is highlighted in bold. But on my web-site when I click some drop down link, the new page opens, but active menu item already isn't bold. How to keep it highlighted in bold on the new page of the web-site?

I tried do this:

```
            $("#menu1 li a").click(function () {
          var url = window.location.href;
            if (url == (this.href)) {
                $('a').removeClass('dropdown-class-name active');
                $(this).addClass('dropdown-class-name active');
            }
        });

```

but `this.href` returns `undefined`, and actually if I use some link instead of `this.href`, this code also works incorrect.

Answer: 
You will have to do the check in the dom ready handler, not in the click handler

```
$('#menu1 li a').click(function (e) {
    $('a').removeClass('dropdown-class-name active');
    $(this).addClass('dropdown-class-name active');
});

var url = window.location.pathname;//need to make sure that this is the href value
$('#menu1 li a[href="'+url+'"]').addClass('dropdown-class-name active');

```
the below code should work

```
$("#menu1 li a").click(function() {
    var $Link = $(this); // cache it as we will use ot mote than once
    //also url == a.href cannot return true if you use relative url in the link.
    //url most likely http://domain.com/pagename href will be just a page name
    //if active do nothing
    if (!$Link.hasClass("active")) {
        $Link.closest("ul") //find menu container
            .find("a.active").removeClass('active'); //find active and remove it
        $Link.addClass('active');
    }
});

```