JSFiddle - React, Tailwind, and code Playground
HTML
<li class="link" id="home" >
<a href="#">Home</a>
</li>
<li class="link" id="flt" >
<a href="#">FLT</a>
</li>
CSS
.link{
padding:10px;
background:Green;
width:100px;
cursor:pointer;
}
.link a{
text-decoration:none;
color:White;
font-family:verdana;
font-size:Medium;
}
.active{
background:Red;
}
JavaScript
$('li').click(function() {
$("li.active").removeClass("active");
$(this).addClass('active');
});