Jquery select element by index

Question

There is my markup:

 <UL style="-moz-border-radius-bottomleft: 0; -moz-border-radius-bottomright: 0" class="ui-tabs ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" sizcache="3" sizset="5"><LI class="ui-state-default ui-corner-top" jQuery1280326216622="3" sizcache="3" sizset="5"><A href="#tab_1" jQuery1280326216622="4"><SPAN>My Job Section</SPAN></A></LI><LI class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active" jQuery1280326216622="5" sizcache="3" sizset="6"><A href="#tab_2" jQuery1280326216622="6"><SPAN>Search</SPAN></A></LI><LI class="ui-state-default ui-corner-top" jQuery1280326216622="7" sizcache="3" sizset="7"><A href="#tab_3" jQuery1280326216622="8"><SPAN>Workflow</SPAN></A></LI><LI class="ui-state-default ui-corner-top" jQuery1280326216622="9" sizcache="3" sizset="8"><A href="#tab_4" jQuery1280326216622="10"><SPAN>Customer Document</SPAN></A></LI></UL>

and the js code:

  jQuery(document).ready(function() {

        jQuery(".ui-layout-center").tabs({   show: loadIframe });

        rootLayout = jQuery('#container').layout
       ({
           applyDefaultStyles: true,
           north__spacing_open: 0
       });

        jQuery("#tabs_div").tabs();
        loadIframe();
    });
function reciveDataFromPages(tabIndex, data) {
       //do some thing
}

how i can active the tab with the index: tabIndex and url : data

Any ideas???

Answer 1

Use :eq(), eg:

$(".ui-tabs a").removeClass("active");
$(".ui-tabs a:eq("+tabIndex+")").addClass("active");

http://api.jquery.com/eq-selector/

Answer 2

If you want to make a tab selected based upon the tab index returned in the function receiveDataFromPages, why can't you just do this:

$(".ui-layout-center").tabs("option", "selected", tabIndex);

I'm not sure why the URL matters in the determination of the selected tab. I may not fully understand the question, though.

Hope this helps!

Answer 3

Use :nth-child(youIndex) in your selector.