jquery ui custom tab with ajax tabs
<p>I am using jquery UI tabs </p>

<p>I have three ajax tabs like so:</p>

<pre><code>&lt;div id="tabs"&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href="linktopage1.jsp"&gt;Failed EIV Pre-Screening&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a  href="linktopage2.jsp"&gt;Failed SSA Screening&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a  href="linktopage3.jsp"&gt;Pending Verification&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;/div&gt;
</code></pre>

<p>I would like to make second tab show up by default when page is loaded.</p>

<p>I tried the following code.</p>

<pre><code>&lt;script type="text/javascript"&gt;
    $(document).ready(function(){
    var $tabs = $('#tabs').tabs();
    $tabs.tabs('select', 1);
    });
&lt;/script&gt;
</code></pre>

<p>Now when the page loads....code in linktopage2.jsp is executed HOWEVER, on the screen still the first tab is selected and the screen is empty.  I explicitly have to click the second tab for the data to show up.</p>

<p>What am I doing wrong or is there something else that can be done?</p>
