Highlight a Navigation Item of the current page using jQuery

Conditionals, jQuery Crumbs

jQuery to find url and add an “active” class to that navigation item. 

    $("[href]").each(function() {
        if (this.href == window.location.href) {
            $(this).addClass("active");
        }
    });

The CSS to style the active class:

.active {
    color: #ccc;
}

For Example:
If we had a Nav item like:

And we went to the About Page, we would see this:

Highlight a Parent Navigation item

What if you have an entire section that anytime you’re on that section the main nav is active?

// if I'm in "whatever-section" highlight my-main-nav-item. 
// example: http://mysite.com/whatever-section/a-page/
if(window.location.href.indexOf("whatever-section") > -1) {
       $('#main-nav .my-main-nav-item a').addClass("active");
}