As I prefer to use PHP includes to visually clean up my sites, I tend to run into a problem where an active state for buttons or icons is not set. This means that if the header is in an include, and a user lands on the contact page, they’re unable to tell whether a menu option is the one they selected. Problematic.But, here’s a couple of code snippets that worked for me, both in JS:

<script>  $(document).ready(function () {  
var url = window.location;
// Will only work if string in href matches with location
$('ul.nav a[href="' + url + '"]').parent().addClass('active');
// Will also work for relative and absolute hrefs  
$('ul.nav a').filter(function () {

return this.href == url;

}).parent().addClass('active').parent().parent().addClass('active');
});
</script>

The only other step is to define the .active class.

ul.nav li.active {
font-weight:bold;
text-decoration:underline;
}
 
I’ve had one major issue with this approach, but it may be due to my own insane site writing; I cannot change the original color.  Font-weight works, background-color works, but for some reason font color does not.
 
Solution found here and a another one here.  Oh, and here’s a PHP solution.