JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://documentcloud.github.com/underscore/underscore.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone.js"></script>
<h1> Model View Collection with Underscore Template Example: </h1>
<div id="example_content">
    <table cellpadding="10" border="2" width="70%" cellspacing="2">
        <tr>
            <th>Name</th>
            <th>Age</th>
        </tr>
        <script type="text/template" id="person_detail_template">
            <tr id="person_detail">
                <td class="name"></td>
                <td class="age"></td>
            </tr> 
        </script>
    </table>
    <p><button id="addPerson">Add Person</button></p>
</div>

JavaScript

Person=Backbone.Model.extend({
initialize:function(){
alert("Welcome to Model Initialization");
    //this.set({name: "abc", age: "27"});
},
    defaults:{
        name: 'abc',
        age:   27
    }
});

PersonView = Backbone.View.extend({
    el: $("#example_content"),
    initialize:function(){
        this.render();
    },
    render:function(){
        var $target = this.$el;               
        var template = _.template( $("#person_detail_template").html(), {} );
        this.$el.find('table').append( template ); $target.find('td.name').text(this.model.get("name"));                $target.find('td.age').text(this.model.get("age"));
    },
     events: {
         'click #addPerson': 'addPerson',
     },
    addPerson:function(){
        this.render();
    }
});

var person= new Person({name:"Thomas",age:67});
//var person= new Person({});

var personeview = new PersonView({ model: person});