JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.js"></script>
Time<input type="text" data-bind="value: newItemTime"/>
Users<input type="text" data-bind="value: newItemUsers"/>
<button data-bind="click: add">Add</button>

<div data-bind="foreach: data">
    <span data-bind="text: Time"></span>
    <span data-bind="text: Users"></span><br/>
</div>

JavaScript

//sample data. Will come from ajax call on page load   
var sampleData = [
    {
    Time: "10AM",
    Users: "10"},
{
    Time: "11AM",
    Users: "13"},
{
    Time: "12AM",
    Users: "15"}
];

//ViewModel
var viewModel = function(model) {
    var self = this;
    self.data = ko.observableArray(ko.toJS(model));
    self.newItemTime = ko.observable();
    self.newItemUsers = ko.observable();
    self.add = function() {
        self.data.push({Time: self.newItemTime(), Users: self.newItemUsers()});
    };
};

//Ajax call to load initial data
$(document).ready(function() {
    $.ajax("/echo/json/", {
        data: {
            json: ko.toJSON(sampleData)
        },
        type: "POST",
        dataType: 'json',
        success: function(data) {
            ko.applyBindings(new viewModel(data));
        }
    });
});