UI TABS - Selecting Tabs By Buttons

by bizamajig

HTML

<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');
    });
});