Replacing inline javascript and event handlers for stricter code.

This post is triggered by the alistapart posting about the same thing. I
had been using the technique for some time. It really cleans up the code.

By applying certain classnames, you can parse the document and add event
handlers after loading, without having to clutter your HTML with script.
Imaging having this in you code:


<dt class="link classMouseHover toggleNextNode">
click this to open definition 1
</dt>
<dd class="hideThisNode">
Lorem ipsum dolor sit amet.
</dd>


Instead of all this:


<dt
onclick="objNode0.style.display=(objNode0.style.di splay=='none')?'block':'none';">
click this to open definition 1
</dt>
<dd id="hidethis0">
Lorem ipsum dolor sit amet.
</dd>
<script type="text/javascript">
var objNode0 = document.getElementById('hidethis0');
objNode0.style.display = 'none';
</script>


Check out the examples at:
http://www.woollymittens.nl/content/...lassbehaviour/

Greeting,
Woolly