Switch to selected tab by name in Jquery-UI Tabs

Rob picture Rob · Feb 23, 2009 · Viewed 120.1k times · Source

If I have three tabs:

<div id="tabs">
    <ul>
        <li><a href="#sample-tab-1"><span>One</span></a></li>
        <li><a href="#sample-tab-2"><span>Two</span></a></li>
        <li><a href="#sample-tab-3"><span>Three</span></a></li>
    </ul>
</div>

I would like to swap to #sample-tab-2 by it's name. I know I can switch to a tab if I know it's number, but in the case I've run into I won't know that.

Notes: JQuery 1.3.1 / JQuery-UI 1.6rc6

Answer

Christian George picture Christian George · Jan 10, 2011

I could not get the previous answer to work. I did the following to get the index of the tab by name:

var index = $('#tabs a[href="#simple-tab-2"]').parent().index();
$('#tabs').tabs('select', index);