jquery - コレクションの更新（追加）時にBackbonejsビューが呼び出されない

Question

既存のデフォルトにコレクションを追加する以外に、ビュー (ヘッダー、ビュー) のデフォルト コレクションがあります。

新しいコレクションがコレクション リストに追加されると、更新に関するコンソール情報が取得されません。

ここに私のコードがあります:

var data = [
    {name:"name1", age:"01"},
    {name:"name2", age:"02"},
    {name:"name3", age:"03"},
    {name:"name4", age:"04"},
    {name:"name5", age:"05"}
];


var model = Backbone.Model.extend({
    defaults:{
        name : "yet to be describe",
        age : "no age data"
    }
});

var collection = Backbone.Collection.extend({
    model : model
});

var view = Backbone.View.extend({
    initialize : function () {
        console.log ("view initiated");
    }
});

var views = Backbone.View.extend({
    initialize : function () {
        _.bindAll(this, 'render');
    },
    render : function () {
         console.log ( this.collection.length ); // i am not getting updates
    }
})

var headerView = Backbone.View.extend({
    initialize : function () {
         _.bindAll(this, 'render');
    },
    render : function () {
        console.log ( this.collection.length ); // i am not getting updates
    }
})

var coll = new collection(data);
var myApp = new views({collection : coll}); // not called on update
var header = new headerView({collection : coll}); // not called on update

$("button").on("click", function () {
    coll.add({name:("name"+(coll.size()+1)), age : coll.size()+1 });
})

私の問題を理解するのを手伝ってもらえますか..?

ライブデモ