jQuery add class .active on menu jQuery add class .active on menu jquery jquery

jQuery add class .active on menu


Click here for a solution in jsFiddle

What you need is you need to get window.location.pathname as mentioned and then create regexp from it and test it against navigation hrefs.

$(function(){    var url = window.location.pathname,         urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); // create regexp to match current url pathname and remove trailing slash if present as it could collide with the link in navigation in case trailing slash wasn't present there        // now grab every link from the navigation        $('.menu a').each(function(){            // and test its normalized href against the url pathname regexp            if(urlRegExp.test(this.href.replace(/\/$/,''))){                $(this).addClass('active');            }        });});


An easier way for me was:

var activeurl = window.location;$('a[href="'+activeurl+'"]').parent('li').addClass('active');

because my links go to absolute url, but if your links are relative then you can use:

 window.location**.pathname**


Get the LI elments, loop through, check the HREF:

$('.menu').find('a').each(function() {    if($(this).attr('href').indexOf('www.xyz.com/other/link1/')>0) {          $(this).addClass('active');    }})