Knockout 2.1

by homer2

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.1.0.js"></script>
Click a box that you own or an unoccupied adjacent box<br/><br/>
<span data-bind="text:turn"></span>'s turn<br/>

<div data-bind="text: ko.toJSON($data)"></div>
<hr>
<pre data-bind="text: JSON.stringify(ko.toJS($data), null, 2)"></pre>

CSS

td{cursor:pointer; color:white; font-size: x-large; width: 20px; height: 20px; border: 1px solid grey}
.blue{background-color: blue; }
.red {background-color: red; }

JavaScript

var viewModel;
$("#board").on("click", "td", function(){            
    viewModel.addValue((ko.dataFor(this)));
});

viewModel = new b();
ko.applyBindings(viewModel);