Prototype Add Class to Class

Question

I have a few div's like this in my page:

<div class="listing-type-list catalog-listing">

I would like to append a class to the div when I hover over it then remove it when I mouseout?

How can this be done with prototype?

Answer 1

Why would you want to do that with prototype, and not use standard CSS for that?

div.listing-type-list.catalog-listing:hover { additional CSS goes here }

This won't work in IE6, but there is htc file for that. You would not be able to select the div via getElementsByClassName in javascript, if that was your intention.

Answer 2

<div class="listing-type-list catalog-listing"
 onmouseover="Element.toggleClassName(this, 'newClass')" 
 onmouseout="Element.toggleClassName(this, 'newClass')" >