JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<ul>
<li>
<a class="active">Opção 1</a>
</li>
<li>
<a class="">Opção 2</a>
</li>
</ul>
<div class="content active">Mostrar conteúdo 1</div>
<div class="content">Mostrar conteúdo 2</div>
CSS
a {
cursor: pointer;
}
li a.active {
border-bottom: 2px solid #000;
}
.content {
display: none;
}
.content.active {
display: block;
}
JavaScript
$(function(){
$('ul li a').click(function(i){
$('ul li a').removeClass('active');
$(this).addClass('active');
$('.content').each(function(index) {
$(this).toggleClass('active');
});
});
});