jQuery ui Tab

there is strange bug in the tab, if the first 'li' refers to remote file. The content coming from the remove file is append outside of the tab (mytabs) div element.

Ex:

<div id="mytabs">

<ul>

<li><a href="sample1.html">Sample1</a></li>

<li><a href="#loc">Sample1</a></li>

<li><a href="sample2.html">Sample2</a></li>

</ul>

<div id="loc">This is local contnet </div>

</div>

<script type="text/javascript">

$j(function() {

$j("#mytabs").tabs();

});

</script>

the content is added after the 'mytabs' div element. due to this the css is not applied properly

and the contents are shown outsize the tab.

if the first tab refers to local div then the contents are added inside mytabs element after

ul element.

ex:

<div id="mytabs">

<ul>

<li><a href="#loc">Sample1</a></li>

<li><a href="sample1.html">Sample1</a></li>

<li><a href="sample2.html">Sample2</a></li>

</ul>

<div id="loc">This is local contnet </div>

</div>

<script type="text/javascript">

$j(function() {

$j("#mytabs").tabs();

});

</script>