Javascript 显示：元素的无/块在Firefox中有效，而不是在Safari或Chrome中

我是JavaScript/CSS新手

我在一行表的左单元格中有一个很长的目录，用于控制右单元格的内容。为了减少垂直滚动，我将ToC分成两部分，并使用display:block/display:none切换它们的可见性

这在Firefox 33中有效，但在Safari 6.2、Chrome 31.0或Eclipse内置浏览器[OSX 10.8.5]中无效

下面是先切换HTML，然后切换JavaScript的代码：

<h4>Contents: <a href='javascript:void(0)' onclick="changeToC(1);">Pages 1-12</a>
<a href='javascript:void(0)' onclick="changeToC(2);">Pages 13-24</a></h4>

function changeToC(number) {
    if (number==1) {
        document.getElementById('EiT_ToC2').style="display: none";
        document.getElementById('EiT_ToC1').style="display: block";
    } else {
        alert("trying to show ToC 2"); // DEBUG
        document.getElementById('EiT_ToC1').style="display: none";
        document.getElementById('EiT_ToC2').style="display: block";
    } // end if
} // end changeToC()

调试警报按预期工作

我的错误是什么？我该如何修复它？普通JavaScript或jQuery均可接受。

正确的语法是：

document.getElementById('EiT_ToC1').style.display = "none";

在jquery中：

$("#EiT_ToC1").css("display", "none");

正确的语法是：

document.getElementById('EiT_ToC1').style.display = "none";

在jquery中：

$("#EiT_ToC1").css("display", "none");