dhtml layers question

i have two div tags. one is visible until a radio button is clicked.
i then have another one shown.

i need to make the first one hidden.

here is my code

Code:

---

function toggle(id2,id) {
    document.all[id2].style.visibility = "visible" ;
    document.all[id].style.visiblity = "hidden";
}
<DIV ID="divShowHide" STYLE=" position:relative;visibility:visible; ">
  <table>
    <tr>
      <td>Do you like green eggs and ham?
      </td>
    </tr>
    <tr>
      <td><input type="radio" name="answer" onClick="toggle('toggleOff','divShowHide');">
        A. Yes</a> <br> <input type="radio" name="answer" onClick="toggle('toggleOff','divShowHide');">
        B. No</a> </td>
    </tr>
  </table>
</DIV>

<div id="toggleOff" style="visibility:hidden;position:relative; ">
  <table border="1" bordercolor="#FF9900">
    <tr>
      <td>who cares what you like.</td>
    </tr>
  </table>
</div>

---

any suggestions are welcome.
thanks

This is IE-specific code. :mad:

Code:

---

function toggle(id2,id) {
  if(navigator.userAgent.indexOf("MSIE") != -1 && parseFloat(navigator.userAgent.substr(navigator.userAgent.indexOf("MSIE")+5)) < 5.5) {
    document.all[id2].style.visibility = "visible" ;
    document.all[id].style.visiblity = "hidden";
  } else {
    document.getElementById(id2).style.visibility = "visible";
  document.getElementById(id).style.visibility = "hidden";
  }
}

---