get the tab text on select jquery ui tabs

Question

I m using jquery ui tabs

I can get the index of the selected tab on "load" (ajax) event

$('#tabs').tabs(
      {
        load: function(e, ui) {
            if($('#tabs').tabs('option','selected') == 0) { }
      }
       });

Now i want to get the tab name

for eg...

<ul>
<li><a href="newprofile.jsp"><span>Profile</span></a></li>
<li><a href="ashout.jsp" id="friends"><span>Shouts</span></a></li>
</ul>

I want to retrieve the text Profile when first tab is clicked or Shout when second tab is clicked.

Thanks

Answer 1

You can use the ui argument passed in, specifically ui.tab to get the anchor element, like this:

var text = $(ui.tab).text();

I don't have your pages to load, but you can test a demo here using the select event, it works the same way.