document.forms[] & CSS

document.forms array - PLEASE HELP
I have a form with multiple, nested <div>'s that i want to hide/show using CSS by clicking on different links.

I am getting errors with the following code...


function showForm(elmnt)
{
for (i=0;i<document.forms[0].elements.length;i++)
{
document.forms[0].elements[i].style.visibility="hidden";
}
switch(elmnt)
{
case "frmClient":
document.forms[0].frmClient.style.visibility="visible";
document.forms[0].txtName.focus();
break;

(i then have many different case statements for the <div>'s i wish to hide/show)

A sample of my <div> usage is:
<div class="form">
<form method="get" action="writeRequest.php">
<!---------------------------links to diff areas of form---------------->
<div>
<a href="#" class="tab" onclick="showForm('frmClient')">Client</a>
<a href="#" onclick="showForm('frmBldg')">Bldg </a>
<a href="#" onclick="showForm('frmFloor')">Floor </a>
<a href="#" onclick="showForm('frmPower')">Power </a>
<a href="#" onclick="showForm('frmRefceil')">Refceil </a>
<a href="#" onclick="showForm('frmFurn')">Furn </a>
<a href="#" style="WIDTH:60px" onclick="showForm('frmElevSect')">Details</a>
<a href="#" style="WIDTH:65px" onclick="showForm('frmAreaCalc')">Area Calcs </a>
<a href="#" style="WIDTH:60px" onclick="showForm('frmFinishes')">Finishes </a>
<a href="#" style="WIDTH:69px" onclick="showForm('frmPlngConst')">Plng/Const </a>
<a href="#" onclick="showForm('frmNotes')">Notes </a>
</div>

(I then have similar <div>'s containing other 'form areas' until I finally close all the <div>'s and the form)

I am getting errors like 'document.forms.0.frmClient.style is null or not a valid object.

What is wrong with this code?


__________________
I greatly appreciate any help you can offer. Thanks!

Gari