JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/cupertino/jquery-ui.css">
<div id="tabs">
<ul>
<li><a href="#tabs1">Tab 1</a></li>
<li><a href="#tabs2">Tab 2</a></li>
<li><a href="#tabs3">Tab 3</a></li>
</ul>
<div id="tabs1">
<p><button id="finish1">enable tab 2</button></p>
</div>
<div id="tabs2">
<p><button id="finish2">enable tab 3</button></p>
</div>
<div id="tabs3">
<p>tab 3</p>
</div>
</div>
JavaScript
var $tabs = $('#tabs').tabs({ disabled: [1, 2] });
$('#finish1').hover(function() {
$tabs.tabs({disabled: [2]});
});
$('#finish2').hover(function() {
$tabs.tabs({disabled: false});
});