Preserved Topic: Standards Compliant DHTML

I am currently learning the standards complient CSS stuff.

Now I want to bring some DHTML (i.e. JavaScript) into the fold. I am looking to do basic div swaps, on a mouse click event, or even better, text manipulations.

here is the div code:

#Menu {

	position:absolute;

	top:105px;

	left:20px;

	width:172px;

	padding:10px;

	background-color:#eee;

	border:1px dashed #999;

	line-height:17px;

	voice-family: "\"}\"";

	voice-family:inherit;

	width:150px;



body>#Menu {width:150px;}

Now I have some content:

home
products
services

Onclick even on products is fired:

home
products
-prod 1
-prod 2
-prod 3
services

Onclick even on products is fired again:

home
products
services

And so on.

With the new CSS2 is there a better way to do this sort of content switching?

Or is it still done the basic ID show hide method.

And if it is done the show hide method, what would be the least code intensive way of doing it.

i.e. how should I write out my divs...

Sorry for the long question, thanks for any help in advance.