JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.min.js"></script>
<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-1.0.0-pre.2.js"></script>
<script type="text/x-handlebars" data-template-name="application">
    {{#each book in books}}
      <a {{action selectBook book target="view"}} href="#">select {{book.name}}</a><br />
    {{/each}}
    <hr />
    
    {{#with selectedBook}} 
      Selected Book: {{name}}
      <br />
      <a {{action cancel this target="view"}} href="#">cancel selected   book</a>
    {{/with}}
</script>

JavaScript

App = Ember.Application.create({
    autoinit: false,
    ready: function() {
        App.get("router.applicationController.books").pushObject(App.Book.create({
            name: "book 1"
        }));
        App.get("router.applicationController.books").pushObject(App.Book.create({
            name: "book 2"
        }));
        App.get("router.applicationController.books").pushObject(App.Book.create({
            name: "book 3"
        }));
    }
});

App.ApplicationController = Ember.Controller.extend({
    books: Em.A(),
    selectedBook: null
});

App.ApplicationView = Ember.View.extend({
    templateName: 'application',
    selectBook: function(event) {
        var book = event.context;
        this.get("controller").set("selectedBook", book);
    },
    cancel: function(event) {
        alert(event.context);
    }
});


App.Router = Ember.Router.extend({
    root: Ember.Route.extend({
        index: Ember.Route.extend({
            route: '/'
        })
    })
});

App.Book = Em.Object.extend({
    name: null
});

App.initialize();