JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script src="http://documentcloud.github.com/backbone/backbone-min.js"></script>

JavaScript

Ingredient=Backbone.Model.extend();
IngredientList=Backbone.Collection.extend({
    model:Ingredient
});

Recipe=Backbone.Model.extend({
    initialize: function(){
        this.ingredientlist = new IngredientList();
        this.ingredientlist.parent = this;
    }
});

RecipeView=Backbone.View.extend({
    initialize: function(){
        recipe = this.model;

        console.log(recipe.get("name"));
        _.bindAll(this,"add","remove");

        recipe.ingredientlist.each(this.add);
        recipe.ingredientlist.bind('add', this.add);
        recipe.ingredientlist.bind('remove', this.remove);
                this.render();
    },

    add: function(ingredient){
        console.log(ingredient.get("name"));
    }
});

r=new Recipe({name:"recipe"});
r.ingredientlist.add( new Ingredient({name:"ingredient1"}) );

v=new RecipeView({model:r});
r.ingredientlist.add( new Ingredient({name:"ingredient2"}) );