JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/css/dataTables.bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/js/jquery.dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.16/js/dataTables.bootstrap.min.js"></script>
<table class="table table-bordered">
  <thead class="mbhead">
    <tr class="mbrow">
      <th>SIID</th>
      <th>Comment</th>  
    </tr>
  </thead>
  <tbody data-bind="foreach: some">
    <tr>
      <td>
        <input type="text" data-bind="text: SIID" class="form-control textbox" />
      </td>      
      <td> 
       <input type="text" data-bind="text: Comment" class="form-control textbox" />
      </td>  
      <!-- ko foreach:  $parent.column -->
      <td> 
       <input type="text" data-bind="text: $parent[$some]" class="form-control textbox" />
      </td>  
     <!-- /ko -->
       <td>
        <input type="button" value="Remove Row" data-bind="click: $parent.removeRow" class="btn btn-danger" />
      </td>
    </tr>
  </tbody>
</table>


<div class="col-xs-12 col-sm-6">
  <input type="button" value="Add Row" class="btn btn-primary" data-bind="click: addRow" /> 
</div>




<table class="table table-bordered">
  <thead class="mbhead">
    <tr class="mbrow">
      <th>SIID</th>
      <th>Comment</th>  
    </tr>
  </thead>
  <tbody data-bind="foreach: data">
    <tr>
      <td>
        <input type="text" data-bind="text: SIID" class="form-control textbox" />
      </td>      
      <td> 
       <input...

JavaScript

(function() {
  var ViewModelSome = function() {
    var self = this;
  self.some = ko.observableArray([]);
   self.column = ko.observableArray([]);

    self.addRow = function() {
      self.some.push(new Some());
    };

    self.removeRow = function(some) {
      self.some.remove(some);
    };

  }
 var Some = function(siid, comment) {
    var self = this;
   self.SIID = ko.observable(siid);
    self.Comment = ko.observable(comment);
    
  };


  vmsome = new ViewModelSome()
  ko.applyBindings(vmsome);

})();





(function() {
  var ViewModelData = function() {
    var self = this;
  self.data = ko.observableArray([]);
   self.column = ko.observableArray([]);

    self.addRow = function() {
      self.data.push(new Data());
    };

    self.removeRow = function(data) {
      self.data.remove(data);
    };

  }
 var Data = function(siid, comment) {
    var self = this;
   self.SIID = ko.observable(siid);
    self.Comment = ko.observable(comment);
    
  };


  vmdata = new ViewModelData()
  ko.applyBindings(vmdata);

})();