JSFiddle - React, Tailwind, and code Playground
HTML
<div id="links">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
<div id="content">
<div>Content 1</div>
<div>Content 2</div>
<div>Content 3</div>
</div>
CSS
.active {
font-weight: bold;
}
#content div {
display: none;
}
JavaScript
$('#links').children().click(function() {
var index = $('#links').children().index(this);
$('#content').children().hide().eq(index).show();
$('#links').children().removeClass('active');
$(this).addClass('active');
});