JSFiddle - React, Tailwind, and code Playground

by Eric Howe

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<ul id="main-nav"></ul>

CSS

.hover {
    background: #eee;
}

JavaScript

var MenuItemView = Backbone.View.extend({
    el: $('<li class="menu-item"></li>'),
    events: {
        'hover a':'handleHover',
    },
    initialize: function() {
        this.el = this.el.clone(true);
        this.el.append('<a>' + this.cid + '</a>');
    }, 
    render: function() {
        return this;
    },
    handleHover: function(ev) {
        $(ev.target).toggleClass('hover');
    }
});
for(var i = 0; i < 5; ++i) {
    var mi = new MenuItemView();
    mi.render();
    $('#main-nav').append(mi.el);
}