Hola amigos, vereis, lo que estoy haciendo es un listado de "fondos"(texto, no imágenes

) tipo menu desplegable que al clicar en un elemento se abra su submenú y al volver a clicar se cierre, parece fácil.
El problema es que la lista la saco de una tabla de la base de datos, entonces ay ya me perdí, por eso pido vuestra ayuda.
Tengo el siguiente código
Código HTML:
<head>
<script type="text/javascript">
document.write('<style>.texthidden {display:none} </style>');
</script>
[PHP]
<?
$total_fondos = -1;
include("conexion.php");
$sql="SELECT * FROM fondos";
$res=mysql_query($sql,$c);
while($registro=mysql_fetch_array($res))
{
$total_fondos ++;
$array_fondos[$total_fondos] = utf8_encode($registro['titulo']);
$array_ids[$total_fondos] = $registro['id'];
}
?>
[/PHP]
<script type='text/Javascript' language='javascript'>
function expandcollapse(fondo){
if (document.getElementById(fondo).style.display=='shown')
{
document.getElementById(fondo).style.display='texthidden';
}
else
{
document.getElementById(fondo).style.display='shown';
}
}
</script>
</head>
<body>
<ul class="menu_contenido">
<?
for ($i=0;$i<=$total_fondos;$i++)
{
echo "<ol><a href='javascript:void(0);' onClick='expandcollapse(".$array_fondos[$i].");'>".$array_fondos[$i]."</a></ol>";
echo "<ul id=".$array_fondos[$i]." class="texthidden"><ol><a href="#">1</a></ol><ol><a href="#">2</a></ol></ul>";
}
?>
</ul>
El listado aparece correctamente pero al clicar no hace nada.
Antes de hacerlo con registros de base de datos me funcionaba bien... Puede que el problema esté en la llamada a la función de javascript. Ojalá podais echarme un cable.
Saludos