为什么我的toggle效果用起来的流畅？


<script src="js/jquery.js" type="text/javascript"></script>
<script language=javascript>
$(document).ready(function(){
 $("#msgdetail h1").toggle(function(){
 $(this).next("#msgp").hide('slow');
},function(){
 $(this).next("#msgp").show('fast');
   });
}); 
</script>
<table width=100% border=0 cellpadding=3 cellspacing=1 class=css_table >    <tr bgcolor="#FFFFFF" >
      <td  class="css_top"><div align="center">编号</div></td>
      <td  class="css_top" width="60%">信息标题</td>
      <td  class="css_top"><div align="center">留言时间</div></td>
    </tr>
    
    <tr>
      <td>100</td>
      <td align="left" id="msgdetail">
      <h1>汉堡</h1>
      <div style="display:none;" id="msgp">
          <strong>内容：</strong>在复旦大学这里看到你们的店，生意太好了，我很想开一家，请速速联系我，速速
      </div>
      </td>
      <td align="center" >2010-4-15&nbsp;</td>
    </tr>
        
    <tr>
      <td>99</td>
      <td align="left" id="msgdetail">
      <h1>汉堡</h1>
      <div style="display:none;" id="msgp">
          <strong>内容：</strong>在复旦大学这里看到你们的店，生意太好了，我很想开一家，请速速联系我，速速
      </div>
      </td>
      <td align="center" >2010-4-15</td>
    </tr>
        
    <tr>
      <td>98</td>
      <td align="left" id="msgdetail">
      <h1>加盟资质</h1>
      <div style="display:none;" id="msgp">
          <strong>内容：</strong>南岔区是伊春下属区不知道是否有加盟资质请将详细信息发到邮箱谢谢您
      </div>
      </td>
      <td align="center" >2010-4-14&nbsp;</td>
    </tr>
</table>
点好几次才有效果？不知道为什么，请教一下各位高手