JSFiddle - React, Tailwind, and code Playground

by kireeti123

HTML

<script src="https://github.com/downloads/knockout/knockout/knockout-2.2.0.debug.js"></script>
<button data-bind="click: addItem">Add</button>
<button data-bind="click: removeItem">Remove</button>
<ul data-bind="template: {name: 'listTemp1', foreach: list1 }">
</ul>

<script id="listTemp1" type="text/html">
    <li data-bind="text: name"></li>
</script>

JavaScript

$(function()  {
    var viewModel = {
        list1: ko.observableArray([ {name: "Bob"} ,{name: "Kris"}, {name: "Rav"} ]),
        addItem: function(){
            this.list1.push({name: "stev"});
        },
        
        removeItem: function(){
            this.list1.pop();
        }
        
    };
    
    ko.applyBindings(viewModel);
});