menu acoderon con bd

[gordot]

hola amigos.. tengo la siguiente tabla que se llama Categorias (cat):

id--nombre
1 libros
2 perros
3 gatos

y otra tabla que se llama Subcategoria (subcat):

relacion - nombre
1 shakespere
1 olguin
2 golden
2 dogo
2 caniche
3 normal

Quiero llenar un menu acordeon vertical de esta forma:

Código HTML:

<ul id="accordion">
    <li><div>libros</div>
        <ul>
            <li><a href="#">shakespere</a></li>
            <li><a href="#">olguin</a></li>
           
        </ul>
    </li>
    <li><div>perros</div>
        <ul>
            <li><a href="#">golden</a></li>
            <li><a href="#">dogo</a></li>
             <li><a href="#">caniche</a></li>
            
        </ul>
    </li>
    <li><div>gatos</div>
        <ul>
            <li><a href="#">normal</a></li>
            
        </ul>
    </li>
</ul> 

La consulta q hago es la siguiente:

Código PHP:

  mysql_query("SELECT c.nom as nom, s.nom as sub FROM cat c INNER JOIN subcat s WHERE c.id=s.id ") 
   

como podria hacerlo sin que se repinta la categoria, ya q con esa consulta se repite la categoria..

muchas gracias

[gordot]

ya esta solucionado de esta forma:

<?

$toro = mysql_query("SELECT c.nom as nom, s.nom as sub FROM cat c INNER JOIN subcat s WHERE c.id=s.id ");

echo '<ul id="accordion">';
$lastnombre = '';
while ($row=mysql_fetch_array($toro))
{
$nombre = $row['nom'];



if ($nombre != $lastnombre)
{echo '<li><div>'; // comienzo de li

echo $nombre;
$lastnombre = $nombre;
echo '</div>';
echo '<ul>';
echo '<li><a href="#">';
echo $row[sub];
echo '</a></li>';


echo '</li>'; // fin de li
}

else
{

echo '<li><a href="#">';
echo $row[sub];
echo '</a></li>';
echo '</li>';
echo '</ul>';

}




}





echo '</ul>';
?>