JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://underscorejs.org/underscore.js"></script>
<script src="http://backbonejs.org/backbone.js"></script>
<div id='content'>
</div>

JavaScript

// parent view for displaying/editing a record. creates its own DOM element.
var RecordView = Backbone.View.extend({
    tagName : "div",
    className : "record",
    events : {
        "click button[name=edit]" : "editRecord",
        "click button[name=remove]" : "removeRecord",
    },
    initialize : function(settings){
        
        // create the two subviews. one for displaying the field(s) and
        // one for editing them. they both listen for our cleanup event
        // which causes them to remove themselves. the display view listens
        // for an event telling it to update its data.
        
        this.displayView = new RecordDisplayView(settings);
        this.displayView.listenTo(this,"cleanup",this.displayView.remove);
        this.displayView.listenTo(this,"onSetData",this.displayView.setData);
        
        this.editView = new RecordEditView(settings);
        this.editView.listenTo(this,"cleanup",this.editView.remove);
        
        // the editView will tell us when it's finished.
        
        this.listenTo(this.editView,"onRecordSave",this.onRecordSave);
        this.listenTo(this.editView,"onRecordCancel",this.onRecordCancel);
        
        this.setData(settings.data,false);
        this.isEditing = false;
        this.activeView = this.displayView;
        
        // we have two elements within our recordView, one for displaying the
        // the header of the record (i.e., info that doesn't change) and
        // one for displaying the subView. the subView element will be
        // bound to BOTH of our subviews.
        this.html = "<div class='header'></div><div class='sub'></div>";
    },
    render : function(){
        // for an explanation of why .empty() is called first, see: http://stackoverflow.com/questions/21031852/backbone-view-delegateevents-not-re-binding-events-to-subview
        this.$el.empty().html(this.html);
        this.$(".header").empty().html("<p>Record ID: "+this.data.id+"</p><p><button...