JSFiddle - React, Tailwind, and code Playground
HTML
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
<li>four</li>
</ul>
CSS
.active {
color: tomato;
}
JavaScript
document.addEventListener('click', function(evt) {
const btn = evt.target.closest('li');
if (btn) {
const prev = document.querySelector('.active');
if (prev) prev.classList.remove('active');
btn.classList.add('active');
}
});