【求助】如何实现把鼠标放在文字上后，下面的table中显示数据

<tr>
<td colspan="2">
<script language="javascript>
function ShowDataDiv(Idx)
{
  for(var i=0;i<this.ShowData.length;i++)
  {
      if(i==Idx)
          this.ShowData[i].style.display="block";
      else
          this.ShowData[i].style.display="none";
  }
}
</script>
<TABLE cellSpacing=0 cellPadding=0 width="100%"  border=0>
<TBODY>
<TR>
<TD align=middle vAlign=bottom bgColor=#FF9900 ><a href="#" onMouseover="ShowDataDiv(0);" >项目介绍</a></TD>
<TD align=middle vAlign=bottom bgColor=#FF9900 >
<a href="#" onMouseover="ShowDataDiv(1);" >交通状况</a></TD>
<TD align=middle vAlign=bottom bgColor=#FF9900 >
<a href="#" onMouseover="ShowDataDiv(2);" >周边配套</a></TD>
<TD align=middle vAlign=bottom bgColor=#FF9900 >
<a href="#" onMouseover="ShowDataDiv(3);" >建材装修</a></TD>
<TD align=middle vAlign=bottom bgColor=#FF9900 >
<a href="#" onMouseover="ShowDataDiv(4);" >相关信息</a></TD>
</TR>
</TBODY>
</TABLE>
</td>
</tr>




<TR vAlign=top>
<TD height="453"  colspan="2">
<table>
<tr>
<td>
<div id="ShowData" style="display:none">
项目介绍
</a>
<div id="ShowData" style="display:none">
交通状况
</a>
<div id="ShowData" style="display:none">
周边配套
</a>   
<div id="ShowData" style="display:none">
建材装修
</a>
<div id="ShowData" style="display:none">
相关信息
</a>               
</td>
</tr>                    
</table>
</TD>
</TR>

谢谢楼上两位帮主哦