JSFiddle - React, Tailwind, and code Playground

HTML

<div class="tabs">
    <a href='#tab1'>Tab 1</a>
    <a href='#tab2'>Tab 2</a>
    <a href='#tab3'>Tab 3</a>
    <a href='#tab4'>Tab 4</a>
</div>
<div class="tabcontainer">
    <div id="tab1" class="tabcontent">
        TAB 1 content
    </div>
    <div id="tab2" class="tabcontent">
        TAB 2 content
    </div>
    <div id="tab3" class="tabcontent">
        TAB 3 content
    </div>
    <div id="tab4" class="tabcontent">
        TAB 4 content
    </div>
</div>

JavaScript

$(document).ready(function(){
    $('.tabs a:first').show();
    $('.tabcontent').not(':first').hide();
    $(document).on('click','.tabs a', function(){
    $(this).addClass('active').siblings().removeClass('active');
    $('.tabcontent').hide();
       $($(this).attr('href')).Animate();
       return false;
    })

})