JSFiddle - React, Tailwind, and code Playground

by magikMaker

HTML

<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-1.2.1.js"></script>
<div data-bind='template: "personTemplate"'> </div>
 
<script id='personTemplate' type='text/html'>
    ${ name } is ${ age } years old
    <button data-bind='click: makeOlder'>Make older</button>
</script>

<script id='personTemplate' type='text/html'>
    <div data-bind="css: { selected: $data === $item.selectedPerson()" }">
        ${ $item.label } <input data-bind="value: name" />
    </div>
</script>

JavaScript

var viewModel = {
    name: ko.observable('Bert'),
    age: ko.observable(78),
    makeOlder: function() {
        this.age(this.age() + 1);   
    }       
};  
ko.applyBindings(viewModel);