there are two links sign-in and register on page top. In page body there are two tabs sign-in and register. When clicked on sign-in it should display sign-in tab and when clicked on register it should display register tab. Both the tabs are present inside seperate div and there is a parent div for these two div's. Currently I am using the following code which displays only first tab on the click of both links:
$("ul#myaccount-details-tabs").tabs("div#myaccount-details-panes>div");
$(".tabs").each(function(){
initTabs($(this).attr("id"));
});
Html code is as follows:
<div id="signin-info-tab-container" >
<ul id="myaccount-details-tabs">
<li><a href="#">sign-in</a></li>
<li ><a href="#">create an account</a></li>
</ul>
<div id="myaccount-details-panes">
<div id="signin-details-panes">
</div><!-- signin-details-panes-->
<div id="register-details-panes">
</div><!--register-details-panes-->
</div><!--myaccount-detailes-panes-->
</div><!--signin-info-tab-container-->
Now, I have to display register tab instead of sig-in tab on the click of register link present on the page top.