Toggling between display block and display none of SVG elements with javascript

Question

I have a javascript script that is trying to change the display properties of individual SVG elements in one fairly large SVG image. I had previously had this working but when copied it into this file it has failed to work. I have tried incorporating the script into the head or the body to no avail. The javascript section is as follows

  <script>
<![CDATA[
    var transMatrix = [1,0,0,1,0,0];
    function toggle(id)
    {
        var e = document.getElementById(id);
        if ( e.style.display == "none" ) 
        {
            e.style.display = "block";
        }
        else if ( e.style.display == "block" ) 
        {
            e.style.display = "none";
        }
    }
    function multi_toggle(list)
    {
        for (var i=0;i<list.length;i++)
        {
            toggle(list[i]);
        }
    }
    ]]>
</script>

And in the control elements I have the attribute

onclick="multi_toggle(['tube-map','suburban-map'])"

Any help would be very apprechiated