jquery tab ajax load

Question

I am following the jqquery docs on loading content via ajax.

My tabs looks like following and the content returned from my rails app via the ajax calls are inserted correctly, with the exception of the third tab where I try to load the content into an existing div "ediv". When I click on this tab I basically see the raw html, if I copy the server response and paste it into firefox console and run it, then the content is corecctly formatted and inserted into "ediv", but it does not do that automatically, like it does for the rest of the tabs.

The content returned from the server is basically of the type.

$('#ediv').html('blah blah');


<script type="text/javascript">
  //<![CDATA[ 
  $(document).ready(function(){

    $('#profile_edit').button({icons:{primary:'ui-icon-key'}})
    $('#tabs').tabs({
      spinner:"<img src='/images/loading.gif'/>",
      ajaxOptions:{
        error:function(xhr, status,index, anchor){
          $(anchor.hash).html("Couldn't load this tab. \n\
        We'll try to fix this as soon as possible.");
        },
        dataType:'script',
        success:function(){
        }
      }
    });
  });
  //]]>
</script>

<div id='tabs'>
<ul>
<li><a href="url_to_ajax_resource"></li>
<li><a href="url_to_ajax_resource"></li>
<li><a title="ediv" href="url_to_ajax_resource_into_existing_div"></li>
</ul>
<div id="ediv">
</div>
</div>