The explanation of the code:
It's like Windows Explorer with folders in the left.
I have a "root" <span> (like My Computer
) and several <span>s inside the "My Computer" <span> (they have a display: none), and more <span>s nested inside those.
When you click on a span, the browser checks if the <span> contains (an) element(s). If it does, it sets its display: block and thus shows it.