JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2012.1.322/styles/kendo.dataviz.min.css">
<script src="http://dl.dropbox.com/u/3234184/kendo.all.min.js"></script>
<div id="example">
    <ul id="display" data-template="person-template" data-bind="source: people"></ul>        
    <div id="window" data-role="window" data-min-height="250px" data-min-width="400px" data-resizable="false" data-title="Edit Window" data-visible="false">
        <label>Name: <input class="k-input" data-bind="value: selectedItem.name"/></label>
        <br />
        <label>Age: <input data-role="numerictextbox" data-bind="value: selectedItem.age" /></label>
        <br />
        <input type="button" class="k-button" id="saveButton" value="Save" />
    </div>
</div>

<script id="person-template" type="text/x-kendo-template">
    <li>
        <span>Name:&nbsp;<span data-bind="text: name"></span></span>
        <span>Age:&nbsp;<span data-bind="text: age"></span></span>
        <input type="button" value="edit" data-bind="click: editItem"/>
    </li>
</script>

CSS

#display 
{
    margin-top: 20px;
    border: 1px solid #000;
    padding: 5px;
    margin: 20px 40px;
}
#display span 
{
    color:#f00;
}

JavaScript

viewModel = kendo.observable({
    people: [
                {name: "Steve", age: 32},
                {name: "Alex", age: 30}
            ],
    selectedItem: null,
    editItem: function(item) {
        this.set("selectedItem", item.data);
        $("#window").data("kendoWindow").open();
    }
});

kendo.bind($("#example"), viewModel);

$("#saveButton").bind("click", function (e) {
    $("#window").data("kendoWindow").close();
});