JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://knockoutjs.com/downloads/knockout-2.3.0.js"></script>
<input id="searchBtn" type="button" value="Search" data-bind="click: SearchItems" />
<table data-bind="foreach: Items">
<tr data-type="user" data-bind="attr: { 'data-result-title':DisplayName(), 'data-result-id':Id() }">
<td data-bind="text: DisplayName()"></td>
<td>
<input type="button" class="select" value="select" style="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" data-bind="click: ClickedMe" />
</td>
</tr>
</table>
JavaScript
var id = 0;
function Item(id, name) {
var self = this;
self.Id = ko.observable(id);
self.DisplayName = ko.observable(name);
self.ClickedMe = function(){
alert("You have clicked me! " + self.DisplayName());
}
}
function ItemsModel() {
var self = this;
self.Items = ko.observableArray([]);
self.SearchItems = function () {
id++;
self.Items.push(new Item(id, 'Some Name ' + id));
}
}
$(function () {
ko.applyBindings(new ItemsModel());
});