well, I went for a different approach, in this case with radiobuttons.
It is working and it is 95% the result desired.
<?php $cats = array(array('first', 'sub-first', 'sub-sub-first'),
array('second', 'sub-second'),
array('third', 'sub-third', 'sub-sub-third')); ?>
<label>Categorias</label> <?php
foreach($cats as $cat):
if (isset($cat[0])): ?>
<div class="div1">
<input type="radio" id="<?php echo $cat[0] ?>" name="age" value="30">
<label for="<?php echo $cat[0] ?>"><?php echo $cat[0] ?></label> <?php
if (isset($cat[1])):?>
<ul class="ul2">
<li class="li2">
<input type="radio" id="<?php echo $cat[0] ?>" name="SUB" value="60">
<label for="<?php echo $cat[1] ?>"><?php echo $cat[1] ?></label><?php
if (isset($cat[2])):?>
<ul class="ul3">
<li class="li3"><a href="#"><?php echo $cat[2] ?></a> </li>
</ul> <?php
endif; ?>
</li>
</ul> <?php
endif; ?>
</div> <?php
endif;
endforeach; ?>
<style media="screen">
ul{
list-style: none;
}
a{
text-decoration: none;
}
a:hover{
color:#EF7522;
}
.div1 ul{
display:none;
}
.div1 input:checked ~ ul {
display: block;
}
</style>