Add class active when clicking the menu link with Jquery
- by Adrian
I have HTML
<div id="top" class="shadow">
<ul class="gprc">
<li><a href="http://www.domain.com/">Home</a></li>
<li><a href="http://www.domain.com/link1/">Text1</a></li>
<li><a href="http://www.domain.com/link2/">Text2</a></li>
<li><a href="http://www.domain.com/link3/">Text3</a></li>
<li><a href="http://www.domain.com/link4">Text4</a></li>
</ul>
</div>
and JQUERY
$(function () {
var url = window.location.pathname,
urlRegExp = new RegExp(url.replace(/\/$/, '') + "$");
$('#top a').each(function () {
if (urlRegExp.test(this.href.replace(/\/$/, ''))) {
$(this).addClass('active');
}
});
});
The problem is that when i click on the Home link all tabs are getting active class and don't understand why. I need it for the first link to not get any active class.