How to highlight active link in a menu?

There is a menu:
<ul id="header_havigation">
 the <li><a href="/">Home</a></li>
 the <li><a href="/news">news</a></li>
 the <li><a href="/photo">photo Album</a></li>
 the <li><a href="/about">About us</a></li>
 the <li><a href="/contact">Contact</a></li>
 </ul>

Need that li was added the active class if the link is active.
Do this:
$(document).ready(function () {
 $('#header_havigation li').each(function () {
 var location = window.location.href;
 var link = this.href;
 if (location == link) {
$(this).addClass('active');
}
});
});


Not working. What to do?
June 27th 19 at 15:18
3 answers
June 27th 19 at 15:20
Solution
$('#header_havigation li a').each(function () {.....
li have no href attribute....
Yeah, but then it will try to add a class active.
How to add li. - Savanna.Smith19 commented on June 27th 19 at 15:23
: $(this).prev().addClass('active'); - Boyd.Romaguera commented on June 27th 19 at 15:26
: $(this).parent("li").addClass('active'); - etha_Rolfson75 commented on June 27th 19 at 15:29
June 27th 19 at 15:22
What you have written in class .active?
With css everything is in order. Not added the class in the html. - Savanna.Smith19 commented on June 27th 19 at 15:25
June 27th 19 at 15:24
In General this deals with the server part usually.

PS the href is the full address, use the pathname

Find more questions by tags HTML