JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/redmond/jquery-ui.css">
<div id="myTabs">    
    <ul  class="tabs">
        <li><a href="#tabone">Tab One</a></li>
        <li><a href="#tabtwo">Tab Two</a></li>
    </ul>
    
    <div id="tabone">You've selected Tab 1</div>
    <div id="tabtwo">You've selected Tab 2</div>
</div>

<input type="button" id="showTab1" value="Show tab 1"/>
<input type="button" id="showTab2" value="Show tab 2"/>

JavaScript

$(document).ready(function() {
    $('#myTabs').tabs();
    
    $('#showTab1').click(function() {
        $('#myTabs').tabs('select', '#tabone');
    });
    
    $('#showTab2').click(function() {
        $('#myTabs').tabs('select', '#tabtwo');
    });
});