JSFiddle - React, Tailwind, and code Playground

by anay1231

HTML

<div id="menu">
<ul>
<li><a id="about-link" class="current" href="#">ABOUT</a></li>
<li><a id="events-link" href="#">EVENTS</a></li>
<li><a id="reviews-link" href="#">REVIEWS</a></li>
<li><a id="contact-link" href="#">CONTACT</a></li>
</ul>
</div>

CSS

.current {
    text-decoration: underline;
}
ul {
    list-style-type: none;
}
a {
    text-decoration: none;
}

JavaScript

$('#menu li a').on('click', function(){
    $('li a.current').removeClass('current');
    $(this).addClass('current');
});
$('#menu').on('click', function(){
    $('li a.current').removeClass('current');
});