JSFiddle - React, Tailwind, and code Playground
HTML
<div style="position: abolute; top: 50px" class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<ul id="yw0" class="nav">
<li class="active"><a href="#" style="color: black">Company</a>
</li>
<li><a href="#" style="color: black" class="link"><i class="fa fa-lightbulb-o"></i> FAQs</a>
</li>
<li><a href="#" style="color: black" class="link"><i class="fa fa-question-circle"></i> Help Center</a>
</li>
<li><a href="#" style="color: black"><i class="fa fa-newspaper-o"></i> Press</a>
</li>
<li><a href="#" style="color: black">Careers</a>
</li>
<li><a href="#" style="color: black" href="#"><i class="fa fa-envelope-o"></i> Contact Us</a>
</li>
</ul>
</div>
</div>
</div>
CSS
li.active {
background-color: red;
}
JavaScript
$("#yw0").on('click', 'li:not(.active)', function () {
$(this).add('li.active').toggleClass('active');
});