JSFiddle - React, Tailwind, and code Playground

by jlspake

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.1/knockout-latest.js"></script>
<div>
  <label>Hello world</label>
  
  <table>
  <tbody data-bind="foreach: Items">
    <tr data-bind="click: $parent.SelectedItem($data)">
      <td><span data-bind="text: Name"></span></td>
      <td><input type="text" data-bind="value: Value"/></td>
    </tr>
  </tbody>
  </table>
</div>

<br/>
<br/>
<span data-bind="text: ko.toJSON(Items)"></span>
<br/>
<span data-bind="text: ko.toJSON(SelectedItem)"></span>

CSS

.selected {
  background-color:green;
}

JavaScript

var vm = {
	Items: ko.observableArray([
  	{ Name: 'Jason', Value: ko.observable(1) },
    { Name: 'Jennifer', Value: ko.observable(2) },
    { Name: 'Aaron', Value: ko.observable(3) }
  ]),
  SelectedItem: ko.observable()
};

ko.applyBindings(vm);