JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="https://raw.github.com/wycats/handlebars.js/1.0.rc.2/dist/handlebars.js"></script>
<script src="https://raw.github.com/emberjs/ember.js/release-builds/ember-1.0.0-pre.4.js"></script>
<div id="content"></div>

<script type="text/x-handlebars" data-template-name="index">
    <button {{action createTab target="App.Tabs"}}>Create New Tab</button>
    <div id="tabs">
        {{view App.Tabs}}
    </div>
</script>

<script type="text/x-handlebars" data-template-name="blank">
    <p class="tab">Blank tab <a {{action remove this target="App.Tabs"}}>x</a></p>
</script>

CSS

#content {
    margin: 20px;
}

#tabs {
    margin-top: 10px;
}
.tab {
    float: left;
    margin: 0 10px;
}
.tab a {
    background: #999;
    color: #fff;
    cursor: pointer;
    padding: 0px 6px 2px;
}

JavaScript

window.App = Ember.Application.create({
	rootElement: '#content'
});
    
App.EmptyTabContent = Ember.View.extend({
    templateName: 'blank'
});
App.Tabs = Ember.ContainerView.create({
    childViews: ['tab'],
    tab: App.EmptyTabContent.create(),
    
    createTab: function() {
        var childViews = this.get('childViews');
        var newTab = App.EmptyTabContent.create();
    
        childViews.pushObject(newTab);
    },
    
    remove: function(el) {
        var childViews = this.get('childViews');
        App.Tabs.removeChild(el);
        //console.log(el.get('element'))
    }
});
    
App.IndexController = Ember.ArrayController.extend({
	tabs: ['Tab1','Tab2']
});
    
App.Router.map(function() {
	this.resource('index', {path: '/'});
});
//App.Tabs.appendTo('#tabs');