JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<div class='liveExample'> 
    
    <form method='POST'> 
        <p>You have asked for <span data-bind='text: users().length'>&nbsp;</span> User(s)</p> 
        <table data-bind='visible: users().length > 0'> 
            <thead> 
                <tr> 
                    <th>user_id</th> 
                    <th>password</th>
                    <th /> 
                </tr> 
            </thead> 
            <tbody data-bind='template: { name: "userRowTemplate", foreach: users }' /> 
        </table> 
        
        <button data-bind='click: addUser'>Add User</button> 
        <button data-bind='click: addJSON'>Add JSON</button> 
    </form> 
    
    <script id='userRowTemplate' type='text/html'> 
        <tr>
<td><input class='required' data-bind='value: user_id, uniqueName: true' /></td>
<td><input class='required number' data-bind='value: password, uniqueName: true' /></td>
          
        </tr>
    </script> 
    
    
</div>

JavaScript

function Users(user_id, password) {
        this.user_id = ko.observable();
        this.password = ko.observable();
    }

    var viewModel = {

        users: ko.observableArray([]),
       

        addUser: function () {
            this.users.push({

                user_id: "",
                password: ""
            });
        },
        
        addJSON: function () {
            

            //Works Fine
            var JSONdataFromServer
            ='[{"user_id":"frances","password":"password"},{"user_id":"timmy","password":"password"},{"user_id":"frances","password":"password"},{"user_id":"timmy","password":"password"},{"user_id":"frances","password":"password"},{"user_id":"timmy","password":"password"},{"user_id":"frances","password":"password"},{"user_id":"timmy","password":"password"},{"user_id":"frances","password":"password"},{"user_id":"timmy","password":"password"},{"user_id":"frances","password":"password"},{"user_id":"timmy","password":"password"}]';

            var results = JSON.parse(JSONdataFromServer);
            
            var i = results.length;
            
            for(var i = 0; i < results.length; i++){
               
                this.users.push(results[i]);
          };   
   
        }
        
    };

    viewModel.users();
    ko.applyBindings(viewModel);