JSFiddle - React, Tailwind, and code Playground

by Ian Roberts

HTML

<ul class="menubar">
    <li><a href="home.php" title="Home">Home</a></li>
    <li><a href="services.php" title="Services">Services</a></li>
    <li><a href="aboutus.php" title="About Us">About Us</a></li>
    <li><a href="contact.php" title="Contact Us">Contact Us</a></li>
</ul>

JavaScript

//Add a class 'selected' 'not-selected' with Jquery to navigation

$('ul.menubar a').each(function(){
    if(location.href === this.href){
        $(this).addClass('selected');
        $('ul.menubar a').not(this).addClass('none');
        return false;
    }
});

//or

//$('ul.menubar a').addClass('none').filter('a[href="'+location.pathname+'"]')
//    .removeClass('none').addClass('selected');

//via - http://stackoverflow.com/questions/10355644/add-a-class-with-jquery-or-javascript-to-a-tag