JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>

<html lang="en-US">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>Backbone demo</title>

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js"></script>

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js"></script>

</head>


<body>

<div id="some-container">

</div>
<!-- #some-container -->


<script type="text/javascript">

var ItemModel = Backbone.Model.extend( {} );


var item1 = {};

item1.model = new ItemModel( { item_class : "nice", item_id : "id1" } );


var item2 = {};

item2.model = new ItemModel( { item_class : "sad", item_id : "id2" } );


var ItemView = Backbone.View.extend( {

  tagName : 'div',

  attributes : function () {

    return {

      class : this.model.get( 'item_class' ),

      id : this.model.get( 'item_id' )

    };

  }
  // attributes

});


item1.view = new ItemView( {

  model : item1.model

} );


item2.view = new ItemView( {

  model : item2.model

} );

</script>

<script type="text/javascript">

ItemView.prototype.render = function () {

  this.$el.html( "Other stuff" );

};


ItemView.prototype.initialize = function ( options ) {

  this.$el.attr( this.attributes() );

};


var el = $( "<div>" );

$( "#some-container" ).append( el );


item2.view = new ItemView( {

  model : item2.model,

  el : el

} );

</script>


<script type="text/javascript">

item2.view.render();

</script>

</body>

</html>