JSFiddle - React, Tailwind, and code Playground

by poztin

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<input id="initialstate" type="hidden" value="4,5,6" />

<ul id="content" data-bind="template: { name: 'item-template', foreach:data }">
    <li>1</li>
    <li>2</li>
    <li>3</li>    
</ul>

<script type="text/html" id="item-template">
    <li data-bind="text: $data"></li>
</script>

JavaScript

var viewModel = (function()
{
    var self = {};
    
    self.data = {};
    
    function init() {
        $('#content').empty(); 
        self.data = ko.observableArray($('#initialstate').val().split(','));
    }
    
    init();
    
    return self;
}());

ko.applyBindings(viewModel);