help putting directory into needed layout

[blanius]

I'm struggling to figure a good way to do the following..

I have a directory structure like this

       

                videos
                   |
Cat1----------Cat2---------cat3
file1           file1         file1
file2           file2 
file3

I need to make one DIV with just the Catagories (I did that) but then for each catagory I need to make a seperat div named for the cat and an unorderd list of each file....

I know there must be an elegant way to code this but I can't seem to get my head around it.

it would look like this when done

<div id="catagories" class="cat page"
<ul>
<li><a href="#cat1">Cat1</a></li>
<li><a href="#cat2">Cat2</a></li>
</ul>
</div>

<div id="cat1">
<ul>
<li>cat1/file1</li>
<li>cat1/file2</li>
</ul>
</div>

etc.....

any suggestions?

[steamPunk]

do you mean like nested lists ? this one's an example from Listamatic

 <div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a>
<ul id="subnavlist">
<li id="subactive"><a href="#" id="subcurrent">Subitem one</a></li>
<li><a href="#">Subitem two</a></li>
<li><a href="#">Subitem three</a></li>
<li><a href="#">Subitem four</a></li>
</ul>

</li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
</ul>
</div>

CSS
#navlist
{
margin-left: 0;
padding-left: 0;
list-style: none;
}

#navlist li
{
padding-left: 10px;
background-image: url(images/arrow.gif);
background-repeat: no-repeat;
background-position: 0 .5em;
}

#navlist ul { list-style: none; }

[blanius]

I'm good on the HTML. I'm trying to figure a good way to process the directory via PHP.

I processin the directory no problem really it's mostly about getting it into the lists.. The lists are NOT nested and must each be in it's own DIV.