Backbone Model Template

Standard fiddle

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.2.3/backbone-min.js"></script>
<input id="radio-choice-h-2b" type="radio">
    <div id="mixture_placeholder"></div>
<script id="mixture_template" type="text/html">
    <h1><%= nationality %></h1>
</script>

JavaScript

var defaultMixtureModel = new (Backbone.Model.extend({
 	url: 'https://randomuser.me/api'
}))

    var Composition_mixture_view = Backbone.View.extend({
        events: {
        	"click #radio-choice-h-2b": "Clicked"
        },
        initialize: function(){ 

        },
        Clicked: function(event) {
            alert('clicked');
			var Default_view = new Mixture_View({model:defaultMixtureModel});
            Default_view.render();
        }
    });

var Mixture_View = Backbone.View.extend({
        el: $('#mixture_placeholder'),
        view_template: _.template($('#mixture_template').html() ),
		initialize: function() {
        	this.model.fetch();
        },

        render: function(){
            console.log(this.model);
            this.$el.html(this.view_template(this.model.toJSON()));
            return this;
        }
    });
var Composition_mixture_view_instance = new Composition_mixture_view({el: 'body'});