JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<div id="tabs">
  <ul>
    <li><a href="#fragment-1">One</a></li>
    <li><a href="#fragment-2">Two</a></li>
    <li><a href="#fragment-3">Three</a></li>
  </ul>
  <div id="fragment-1">
    Aba #1
      <input type="button" class="proximo" value="&gt;&gt;" />
  </div>
  <div id="fragment-2">
    Aba #2
      <input type="button" class="proximo" value="&gt;&gt;" />
  </div>
  <div id="fragment-3">
    Aba #3
      <input type="button" class="proximo" value="&gt;&gt;" />
  </div>
</div>

JavaScript

$("#tabs").tabs();

$(".proximo").on("click", function() 
{
    var indice = $('#tabs ul li a[href="#' + $(this).parent().prop("id") + '"]').parent().index();
    
    $("#tabs").tabs("option", "active", (indice + 1));
});