jQuery $(document).ready() 的疑问

以下代码参考网络资料 showin_fl.php<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style type="text/css">
body,ul,li{margin: 0;padding: 0;font: 12px normal "宋体", Arial, Helvetica, sans-serif;list-style: none;}
a{text-decoration: none;color: #000;font-size: 14px;}.tab_conbox{border: 1px solid #999;border-top: none;}
.tab_con{ display:none;}.tabs{height: 32px;border-bottom:1px solid #999;border-left: 1px solid #999;width: 100%;}
.tabs li{height:31px;line-height:31px;float:left;border:1px solid #999;border-left:none;margin-bottom: -1px;background: #e0e0e0;overflow: hidden;position: relative;}
.tabs li a {display: block;padding: 0 20px;border: 1px solid #fff;outline: none;}
.tabs li a:hover {background: #ccc;}
.tabs .thistab,.tabs .thistab a:hover{background: #fff;border-bottom: 1px solid #fff;}.tab_con {padding:12px;font-size: 14px; line-height:175%;}
</style>
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
jQuery.jqtab = function(tabtit,tab_conbox,shijian) {
$(tab_conbox).find("li").hide();
$(tabtit).find("li:first").addClass("thistab").show(); 
$(tab_conbox).find("li:first").show();

$(tabtit).find("li").bind(shijian,function(){
  $(this).addClass("thistab").siblings("li").removeClass("thistab"); 
var activeindex = $(tabtit).find("li").index(this);
$(tab_conbox).children().eq(activeindex).show().siblings().hide();
return false;
});

};
/*调用方法如下：*/
$.jqtab("#tabs","#tab_conbox","click");

$.jqtab("#tabs2","#tab_conbox2","mouseenter");

});
</script>
</head>
<body>
    <ul class="tabs" id="tabs">
       <li> 基本资料 </li>
       <li> 个人信息 </li>
       <li> 调职调薪记录 </li>
       <li> 薪资设定 </li>
    </ul>
<ul  class="tab_conbox" id="tab_conbox">
<li class="tab_con"> 1 </li>
<li class="tab_con"> 2 </li>
<li class="tab_con"> 3 </li>
<li class="tab_con"> 4 </li>
</ul>
</body>
</html>
目的是实现一个分组显示内容的页面, 单独运行是正常的现在需要把这些内容用AJAX的方式来调用, 发出请求后把这个页面的内容写到一个DVI里面
完成以后发现内容无法显示, 也无法相应鼠标的事件 ,应该是$(document).ready(function() 的代码未能执行.  
现在的问题是 这部分代码应该如何修改代码index.php<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#searchResult{width:830px;height:400px; OVERFLOW: scroll; OVERFLOW-X: hidden; border:1px dotted black; margin-top:1px;background-color:#eee; }
</style>
<script>
var cur_id_no=0;
var cur_main_states=0
var xmlhttp;function id$(str){return (document.getElementById(str));}
function getXMLRequester(){
var xmlhttp_request=false;
try{
if(window.ActiveXObject) {
for (var i=5;i>-1;i--){
try{
if (i==2){
xmlhttp_request=new ActiveXObject("Microsoft.XMLHTTP");
}else{
xmlhttp_request=new ActiveXObject("Msxml2.XMLHTTP."+i+".0");
}
break;
}catch(e){
xmlhttp_reques=false;
}
}
}else if (window.XMLHttpRequest) {
xmlhttp_request=new XMLHttpRequest();
}
}catch(e){
xmlhttp_request=false;
}
return xmlhttp_request;
}function xmlhttp_onreadystatechange(){
if(xmlhttp.readyState==4){
if(xmlhttp.status==200){
id$("searchResult").innerHTML=xmlhttp.responseText;
}else{
id$("searchResult").innerHTML="载入失败,返回码:"+xmlhttp.status;
}
}else{
id$("searchResult").innerHTML="载入中,当前状态:"+xmlhttp.readyState;
}}
function start_search(){
cur_main_states=0;
        var baseURl="showin_fl.php";
xmlhttp=getXMLRequester();
xmlhttp.onreadystatechange=xmlhttp_onreadystatechange;
xmlhttp.open("GET",baseURl,true);
xmlhttp.send(" ");

}
</script>
</head><body>
<DIV id="searchBar">
<input id="cmd_search" type="button" onclick= "start_search()"  value="刷新"/>
</DIV>
<div id="searchResult"></div>
</body>
</html>jQueryJavaScript