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" data-id='1'>Opção 1</a>
  </li>
  <li>
    <a class="" data-id='2'>Opção 2</a>
  </li>
</ul>
<div class="content active" data-id='1'>Mostrar conteúdo 1</div>
<div class="content" data-id='2'>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(){
  	$('ul li a').removeClass('active');
    $('.content').removeClass('active');
    $(this).addClass('active');
    var id = $(this).data('id');    
    var content = $('.content').filter(function() { 
      return $(this).data("id") == id 
    });    
    content.addClass('active');
  });
});