xhtml/css/javascript - Need someway to expand/collapse lists

I need a way to expand and collapse lists. I now have a list of almost 50 individuals here [login to view URL] , and they are grouped in 11 regions. I need a way to be able to expand/collapse them based on the region itself. I know that this can be done easily with Javascript, but I also have a vague impression that it can be done with CSS only. Please include referances or examples to the solution you suggest in the bid itself. And comments on why your solution is best is also apriciated! (I dont know wheter it is best to go for a Javascript way or the CSS way.) -- You can see in my non-actio-ratio that I always fulfill a project, I dont only use it as a resource pool! I do complete! Always! :) ## Deliverables The site [login to view URL] which this should be used on is under redesign, and will be launched as a wordpress site. So for now, this project will be completed with the code developed during this project, will be implemented on a subpage on [login to view URL] which is also a wordpress site. I am open for using javascript or jQuery on this, but if CSS works equally as well, I wish some information on why use jQuery/Javascript instead? :) I also require all the codes and neccessary files delivered in a zip file, with instructions how to set it up myself.