JSFiddle - React, Tailwind, and code Playground
HTML
<div class="navbar navbar-default navbar-fixed-top" style="z-index:100;">
<div class="container">
<div class="navbar-header">
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main"> <span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse" id="navbar-main">
<ul class="nav navbar-nav">
<li class="itemFirst"><a href="#slideAI" class="scroll">AdvisorIntelligence</a>
</li>
<li><a href="#slidePS" class="scroll">Portfolio Strategies</a>
</li>
<li><a href="#slideMF" class="scroll">Masters Funds</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="http://litmangregory.com/overview.aspx" target="_blank">About</a>
</li>
<li><a href="#slideC" class="scroll">Contact</a>
</li>
</ul>
</div>
</div>
</div>
CSS
.selected {
color:#a4d2ef !important;
}
JavaScript
// Active Menu Link
jQuery("#navbar-main li a").live('click', function () {
jQuery("#navbar-main li a").removeClass("selected");
jQuery(this).addClass("selected");
return false;
});