JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.7.0/underscore-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"></script>

CSS

li {

  margin: 1em auto;

}

JavaScript

$( document ).ready( function () {

  // View class with `attributes` method
  var View = Backbone.View.extend( {
    attributes : function () {
      // Return model data
      return {
        class : this.model.get( 'item_class' ),
        id : this.model.get( 'item_id' )
      };
    }
    // attributes
  } );

  // Pass model to view constructor
  var item = new View( {
    model : new Backbone.Model( {
      item_class : "nice",
      item_id : "id1"
    } )
  } );

  var item2 = new View( {
    model : new Backbone.Model( {
      item_class : "sad",
      item_id : "id2"
    } )
  } );

  View.prototype.render = function () {

    return this;

  };


  // For each item, generate HTML representation of it and output HTML-escaped
  // so the markup will be displayed, not rendered.

  var $ul = $( "<ul>" );
  
  [ item, item2 ].forEach( function ( current_item ) {

    $ul.append( $( "<li>" ).text( current_item.render().el.outerHTML ) );

  } );

  $ul.appendTo( "body" );

} );