JSFiddle - React, Tailwind, and code Playground
HTML
<div id="el">
<div class="innerBox" id="item1">
This is item 1
</div>
<div class="innerBox" id="item2">
This is item 2
</div>
<div class="innerBox" id="item3">
This is item 3
</div>
</div>
CSS
.innerBox{
height: 200px;
width: 200px;
float: left;
}
#item1{
background-color: green;
}
#item2{
background-color: blue;
}
#item3{
background-color: yellow;
}
JavaScript
var clicked = function(myObj){
alert("You clicked on div with id = "+myObj.id);
}
var myClass = new Class ({
Implements: Events,
initialize: function(elements){
//your code
$('el').addEvent('click:relay(div)', this.click.bind(this));
},
click: function(ev, divObj){
this.fireEvent('click', divObj);
}
});
window.addEvent('domready', function(){
var obj = new myClass();
obj.addEvent('click', clicked);
});