html结构放在页面中有效，通过Ajax加载进来怎么就用不了效果了？

刚学js，现在在试着做一个后台模板，先上相关代码吧index.html<div class="ui-layout-north">
<h1>网站后台管理系统</h1>
    
    <ul id="sys" class="llink">
        <li><a href="#">后台首页</a></li>
        <li><a href="#">网站首页</a></li>
        <li><a href="#">修改密码</a></li>
        <li><a href="#">退出</a></li>
    </ul>
    <ul id="sysblock" class="llink">
     <li class="on"><a href="#">系统首页</a></li>
        <li><a href="#">系统配置</a></li>
        <li><a href="#">新闻管理</a></li>
        <li><a href="#">产品管理</a></li>
        <li><a href="#">招聘管理</a></li>
    </ul>
</div> 
<div id="sidebar" class="outer-west">
<img src="images/loading.gif" id="loading-img" alt="数据加载中..." />
</div> <div class="outer-center">
<iframe src="main.html" frameborder="0" scrolling="auto" name="ifContent" id="ifContent">
     对不起，您的浏览器不支持iframe框架，请升级浏览器后查看。
    </iframe>
</div>
css：
/* top */
 .llink{
  position:absolute;}
.llink li{
float:left;}
.llink li a{
float:left;color:#000;text-decoration:none;padding:3px 10px;cursor:pointer;}
.llink li a:hover{
color:#ddd;}
 #sys{  /* system link */
  top:0;right:10px;}

 #sysblock{  /* tab menu */
  bottom:0;left:200px;}
#sysblock li{
margin-right:3px;}
#sysblock li a{
font-weight:bold;background:#999;}
  #sysblock li.on a{
color:#fff;background:#000;}
 /* menu */
 .menu{
  width:180px;overflow:hidden;}
.menu dt{
color:#fff;font-weight:bold;text-align:center;line-height:30px;border:none;
background: #333;border-top:1px solid #666;border-bottom:1px solid #000;}
.menu dd{
overflow:hidden}
.menu dd a{
color:#FF7C00;text-decoration:none;display:block;width:180px;line-height:30px;text-align:center;
background:#ddd;border-bottom:1px solid #eee;border-bottom:1px solid #999;}
.menu dd a:hover{
color:#ddd;background:#444;}
.menu dd ul{
display:none;}
.menu dd li a{
color:#666;font-weight: normal;background:#fff;border:none;}
.menu dd li a:hover{
font-weight: bold;color:#000;background:#e1e1e1;}
.menu dd.on ul{
display:block;}
 #loading-img{
  widt:16px;height:16px;position:absolute;top:40%;left:50%;
margin-top:-8px;margin-left:-8px;display:block;}js代码：$(document).ready(function(){
   
  /* sysblock */
$("#sidebar").load("menu.html dl#m1");
$("#sysblock li>a").each(function(index){
$(this).click(function(){
$("#sysblock li.on").removeClass("on");
$(this).parent().addClass("on");
if(index == 0){
$("#sidebar").load("menu.html dl#m1");
$("#ifContent").attr("src","main.html");
}else if(index == 1){
$("#sidebar").load("menu.html dl#m2");
$("#ifContent").attr("src","settings.html");
}else if(index == 2){
$("#sidebar").load("menu.html dl#m3");
$("#ifContent").attr("src","news.html");
}else if(index == 3){
$("#sidebar").load("menu.html dl#m4");
$("#ifContent").attr("src","product.html");
}else if(index == 4){
$("#sidebar").load("menu.html dl#m5");
$("#ifContent").attr("src","jobs.html");
}
});
});

/* 绑定加载图片的ajax事件 */
$("#loading-img").bind("ajaxStart",function(){
$("#sidebar").html("");
$(this).show();
}).bind("ajaxStop",function(){
$(this).hide();
});

/* menu */
$(".menu dd>a").each(function(index){
$(this).click(function(){
$(".menu dd.on").removeClass("on");
$(this).parent().addClass("on");
});
});

});
menu.html代码：<!-- menu1 -->
<dl id="m1" class="menu">
        <dt>系统首页</dt>
        <dd class="on"><a href="#">我的文档</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的音乐</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的图片</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的文档</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的音乐</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的图片</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的文档</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的音乐</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的图片</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
    </dl>
    <!-- menu2 -->
    <dl id="m2" class="menu">
        <dt>系统配置</dt>
        <dd class="on"><a href="#">我的文档</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的音乐</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
    </dl>
    <!-- menu3 -->
    <dl id="m3" class="menu">
        <dt>新闻管理</dt>
        <dd class="on"><a href="#">我的文档</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的音乐</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的图片</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的图片</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
    </dl>
    <!-- menu4 -->
    <dl id="m4" class="menu">
        <dt>产品管理</dt>
        <dd class="on"><a href="#">我的文档</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的音乐</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
        <dd><a href="#">我的图片</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
    </dl>
    <!-- menu5 -->
    <dl id="m5" class="menu">
        <dt>招聘管理</dt>
        <dd class="on"><a href="#">我的文档</a>
         <ul>
             <li><a href="#">共享文档</a></li>
                <li><a href="#">共享音乐</a></li>
                <li><a href="#">图片收藏</a></li>
            </ul>
        </dd>
    </dl>
 想实现的是点击上面tab标签，加载不同的左边菜单，所以我把所有菜单的html放在一个页面，用Ajax通过id加载进来，写的js最下面那段是实现左边菜单点击某一项，显示其子选项菜单，原来菜单html放在页面中，效果正常，但是通过Ajax加载进来就没用，那段js执行不到，刚学js，Ajax也只是通过一些实例了解一点，却不懂他的原理，请大家帮我看下，怎么修正，谢谢了