javascript实现下来菜单效果在IE上可以实现，为什么在Firefox不可以实现？

Question

<script   type="text/javascript"> 
<!-- 
        function   switchCellleft(n){for(i=0;i <trd.length;i++){trd[i].style.display="none";lftd[i].className="box_gary05";} trd[n].style.display="block";lftd[n].className="box_gary01";} 
//--> 
</script> 
其中：trd为table行的id,lftd为列的ID 上面是我的javascript脚本，在IE上是可以看到效果的，为什么到Firefox就没有效果了呢？请各位大虾指点下！在此先谢过了！
我的页面设计是这样的：
<%@   Control   Language="C#"   AutoEventWireup="true"   Codebehind="procleft.ascx.cs"   Inherits="WebApp.UserControl.procleft"   %> 
<script   type="text/javascript"> 
<!-- 
        function   switchCellleft(n){for(var   i=0;i <trd.length;i++){trd[i].style.display="none";lftd[i].className="box_gary05";}trd[n].style.display="block";lftd[n].className="box_gary01";} 
//--> 
</script> 
<table   width="160px"   border="0"   cellspacing="0"   cellpadding="0"> 
        <tr> 
                <td   class="box_gary03"   style="height:   36px"> 
                </td> 
        </tr> 
        <tr> 
                <td   class="box_black"   style="height:   18px"> 
                        <asp:Literal   ID="Lit_ProdServ"   runat="server"   Text=" <%$   Resources:SiteResource,   head_ProdServ   %> "> </asp:Literal> </td> 
        </tr> 
        <tr> 
                <td   class="box_gary01"   onclick="switchCellleft(0)"   id="lftd"> 
                        <a   href="../proclist.aspx"   class="left_blue"> + 
                                <asp:Literal   ID="Lit_products"   runat="server"   Text=" <%$   Resources:SiteResource,   left_products   %> "> </asp:Literal> </a> </td> 
        </tr> 
        <tr   id="trd"   style="display:   none;"> 
                <td   bgcolor="#E0F4FB"> 
                        <table   width="160px"   border="0"   cellspacing="0"   cellpadding="0"> 
                                <tr> 
                                        <td   class="box_gary03"   style="width:   160px"> 
                                                <font   color="#0087ff"> &nbsp;. </font>   &nbsp; <a   href="../proclist.aspx?type=p001"   class="left_blue" 
                                                        id="p001"> <asp:Literal   ID="Lit_Prod_RF"   runat="server"   Text=" <%$   Resources:SiteResource,   left_prod_RF   %> "> </asp:Literal> </a> 
                                        </td> 
                                </tr> 
                                <tr> 
                                        <td   class="box_gary03"   style="width:   160px"> 
                                                <font   color="#0087ff"> &nbsp;. </font>   &nbsp; <a   href="../proclist.aspx?type=p002"   class="left_blue" 
                                                        id="p002"> <asp:Literal   ID="Lit_Prod_Automotive"   runat="server"   Text=" <%$   Resources:SiteResource,   left_prod_Automotive   %> "> </asp:Literal> </a> 
                                        </td> 
                                </tr> 
                                <tr> 
                                        <td   class="box_gary03"   style="width:   160px"> 
                                                <font   color="#0087ff"> &nbsp;. </font>   &nbsp; <a   href="../proclist.aspx?type=p003"   class="left_blue" 
                                                        id="p003"> <asp:Literal   ID="Lit_Prod_Distributed"   runat="server"   Text=" <%$   Resources:SiteResource,   left_prod_Distributed   %> "> </asp:Literal> </a> 
                                        </td> 
                                </tr> 
                                <tr> 
                                        <td   class="box_gary05"   style="width:   160px"> 
                                                <font   color="#0087ff"> &nbsp;. </font>   &nbsp; <a   href="../proclist.aspx?type=p004"   class="left_blue" 
                                                        id="p004"> <asp:Literal   ID="Lit_Prod_More"   runat="server"   Text=" <%$   Resources:SiteResource,   left_prod_More   %> "> </asp:Literal> </a> 
                                        </td> 
                                </tr> 
                        </table> 
                </td> 
        </tr> 
        <tr> 
                <td   class="box_gary05"   style="height:   19px"   onclick="switchCellleft(1)"   id="lftd"> 
                        <a   href="../service.aspx"   class="left_blue"> <span> + 
                                <asp:Literal   ID="Lit_Services"   runat="server"   Text=" <%$   Resources:SiteResource,   left_Services   %> "> </asp:Literal> </span> </a> </td> 
        </tr> 
        <tr   id="trd"   style="display:   none;"> 
                <td   bgcolor="#E0F4FB"> 
                        <table   width="160px"   border="0"   cellspacing="0"   cellpadding="0"> 
                                <tr> 
                                        <td   class="box_gary03"   style="width:   160px"> 
                                                <font   color="#0087ff"> &nbsp;. </font>   &nbsp; <a   href="../service.aspx?type=s001"   class="left_blue" 
                                                        id="s001"> <asp:Literal   ID="Lit_Services_RF"   runat="server"   Text=" <%$   Resources:SiteResource,   left_Services_RF   %> "> </asp:Literal> </a> 
                                        </td> 
                                </tr> 
                                <tr> 
                                        <td   class="box_gary03"   style="width:   160px"> 
                                                <font   color="#0087ff"> &nbsp;. </font>   &nbsp; <a   href="../service.aspx?type=s002"   class="left_blue" 
                                                        id="s002"> <asp:Literal   ID="Lit_Services_Automotive"   runat="server"   Text=" <%$   Resources:SiteResource,   left_Services_Automotive   %> "> </asp:Literal> </a> 
                                        </td> 
                                </tr> 
                                <tr> 
                                        <td   class="box_gary05"   style="width:   160px"> 
                                                <font   color="#0087ff"> &nbsp;. </font>   &nbsp; <a   href="../service.aspx?type=s003"   class="left_blue" 
                                                        id="s003"> <asp:Literal   ID="Lit_Services_Production"   runat="server"   Text=" <%$   Resources:SiteResource,   left_Services_Production   %> "> </asp:Literal> </a> 
                                        </td> 
                                </tr> 
                        </table> 

Answer 1

最好用列表来做
<ul>
<li>...</li>
</ul>
<table/>虽然也可以实现，但是个人觉得不好操作另外，要获取id的话，最好用document.getElementById("id名")

Answer 2

<script type="text/javascript">
<!--
    function switchCellleft(n){
    for(var i=0;i<trd.length;i++)
    {
        document.getElementById('trd')[i].style.display="none";
        document.getElementById('lftd')[i].className="box_gary05";
    }
        document.getElementById('trd')[n].style.display="block";
        document.getElementById('lftd')[n].className="box_gary01";
    }
//-->
</script>
是不是改为这样就可以了啊！？