Example

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>
<script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.js"></script>
<div id="schoolContentOuterPnl"></div>
<script type="text/template" id="healthRecordTemplate">
    <div>Template</div>
    <div id="divSchoolHealthViewEdit"></div>
</script>
<script type="text/template" id="studentHealthTemplate">
    <div>Child</div>
</script>

JavaScript

var healthRecordTemplate = $('#healthRecordTemplate').html();
var ViewStudentHealthTemplate = $('#studentHealthTemplate').html();

var ViewStudentHealthView = Backbone.View.extend({
    initialize: function(){
        this.render();
    },
    
    render : function() {
        // template
        var data = {};
        var ViewStudentHealthCompiledTemplate = _.template(ViewStudentHealthTemplate, data);
        // append the item to the view's target
        
        this.$el.html(ViewStudentHealthCompiledTemplate);
    }
    
});
var StudentHealthRecordView = Backbone.View.extend({
    // target item.
    el: $("#schoolContentOuterPnl"),

    render: function () {
        var data = {};
        // template
        var healthcompiledTemplate = _.template(healthRecordTemplate, data);
        // append the item to the view's target
        this.$el.html(healthcompiledTemplate);
        this.viewHealthClickEvent();
    },

    viewHealthClickEvent: function () {
        new ViewStudentHealthView({
            el: this.$("#divSchoolHealthViewEdit")
        });
    }
});


new StudentHealthRecordView().render();