Ocultar divs

[erponcios]

Buenas gente, estoy intentando hacer una especie de presupuesto online. Bien tengo dos checkbox, uno para páginas web dinámicas y otro para páginas web estáticas.

Lo que quiero es que cuando seleccione uno, el otro se me oculte, y si esta seleccionado el checkbox de estática, me muestre además otro div (que contendrá la extensión de la página).

Para ello he creado una funcion:

Código:

function disponibilidad(){

if (ob.estatic.checked==true){
		
document.getElementById(extension).style.visibility="visible";
document.getElementById(dinamica).style.visibility="hidden"; 
total=total+parseInt(ob.extension.value);
		
}else{
		
document.getElementById(dinamica).style.visibility="visible"; 
		
}
	
if (ob.dinamic.checked==true){
		
document.getElementById(extension).style.visibility="hidden";
document.getElementById(estatica).style.visibility="hidden"; 
total=total+parseInt(ob.dinamic.value);
		
}else{
	
document.getElementByI(extension).style.visibility="visible"; 
document.getElementById(estatica).style.visibility="visible"; 
		
}
	
}

La estructura web que tengo es la siguiente:

Código HTML:

<div align="center" name="estatica" id="estatica">
                        <tr bgcolor="#FFFFFF">
                          <td class="texto"><div align="left"><img src="Images/espacio.gif" width="5" height="1" >Est&aacute;tica: T&eacute;cnolog&iacute;a HTML,PHP,JS. <br >
                          </div></td>
                          <td colspan="3" align="center">
                            <input name="estatic" type="checkbox" id="estatic" onClick="disponibilidad()" >
                          </td>
                        </tr></div><div name="dinamica" id="dinamica">
                        <tr bgcolor="#FFFFFF">
                          <td class="texto"><img src="Images/espacio.gif" width="5" height="1" >Din&aacute;mica: Macromedia Flash</td>
                          <td colspan="3" align="center">
                          <input name="dinamic" type="checkbox" id="dinamic" onClick="disponibilidad()" value="300" ></td>
                        </tr></div>

<div id="extension" name="extension">
                <table border="0" cellpadding="0" cellspacing="0" >
                  
				  <tr bgcolor="#FFFFFF">
                    <td width="349"><img src="Images/espacio.gif" width="5" height="8" ><span class="titulo">Extensi&oacute;n del sitio</span></td>
                    <td width="31"><select name="extension" class="total" id="extension" onChange="disponibilidad()">
                        <option value="100">5 p&aacute;g.</option>
                        <option value="120">6 p&aacute;g.</option>
                        <option value="140">7 p&aacute;g.</option>
                        <option value="160">8 p&aacute;g.</option>
                        <option value="180">9 p&aacute;g.</option>
                        <option value="200">10 p&aacute;g.</option>
                        <option value="220">11 p&aacute;g.</option>
                        <option value="240">12 p&aacute;g.</option>
                        <option value="260">13 p&aacute;g.</option>
                        <option value="280">14 p&aacute;g.</option>
                        <option value="300">15 p&aacute;g.</option>
                        <option value="320">16 p&aacute;g.</option>
                        <option value="340">17 p&aacute;g.</option>
                        <option value="360">18 p&aacute;g.</option>
                        <option value="380">19 p&aacute;g.</option>
                        <option value="400">+20 p&aacute;g.</option>
                    </select></td>
                    <td width="5">&nbsp;</td>
                  </tr>
				  <tr bgcolor="#FFFFFF">
				    <td>&nbsp;</td>
				    <td>&nbsp;</td>
				    <td>&nbsp;</td>
				    </tr>
                </table>
              </div> 

El problema es que me da error, no me va... no me hace nada, si alguien me pudiera ayudar se lo agradecería muchisimo gracias.

Un saludo.