JSFiddle - React, Tailwind, and code Playground

HTML

<button data-target=".tab-1">Tab #1</button>
<button data-target=".tab-2">Tab #2</button>

<div class="tab tab-1">
	<div class="content">This is Tab #1</div>
</div>

<div class="tab tab-2">
	<div class="content">This is Tab #2</div>
</div>

CSS

.tab:not(.active) { display: none; }

.content { transition: 3s all ease-out; }

JavaScript

$('button').on('click', function () {
	var tab = $(this).attr('data-target');

	$('.tab').removeClass('active');
	$(tab).toggleClass('active');
	
	$('.content').removeClass('animate');
	$(tab).find('.content').toggleClass('animate');
});