Knockout Observable Array
HTML
<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-1.3.0beta.debug.js"></script>
<button data-bind="click: addItem">Add</button>
<button data-bind="click: removeItem">Remove</button>
<ul data-bind="template: { name: 'listTempl', foreach: list }">
</ul>
<script id="listTempl" type="text/html">
<li data-bind="text: name"></li>
</script>
JavaScript
$(function() {
var data = [ {name: "Bob"}, {name: "Joe"}, {name: "John"} ];
var viewModel = {
list: ko.observableArray(data),
addItem: function() {
this.list.push({ name: "Steve"});
},
removeItem: function() {
this.list.pop();
}
};
ko.applyBindings(viewModel);
});