Example

This page contains a script registering two style rules:

var rules = {
    '.clickable' : {
        onclick : function() { alert('clicked!'); }
    },

    '.hoverable' : {
        onmouseover : function() { this.style.color = 'red'; },
        onmouseout : function() { this.style.color = 'black'; }
    }
};

The first rule renders the following div clickable, meaning it responds to the onclick event with an alert box:

The second rule renders the following div hoverable, meaning it response to the mouse hovering over it by turning its text red. Notice that this behavior is combined with the existing behavior: the div originally has an onmouseover event that turns its text bold, which is not overridden.