JSFiddle - React, Tailwind, and code Playground

HTML

<section class="tab" id="firstSection">
    <h1>First Section</h1>
    <p>First Name: <strong data-bind="text: name"></strong></p>
    <p>First name: <input data-bind="value: name" /></p>
</section>
 
<section class="tab" id="secondSection">
    <h1>Second Section</h1>
    <p>Second Name: <strong data-bind="text: name"></strong></p>
    <p>Second name: <input data-bind="value: name" /></p> 
</section>

JavaScript

function firstViewModel() {
    var self = this;
    self.name = ko.observable("Enter Name");            
};
 
function secondViewModel() {
    var self = this;
    self.name = ko.observable("Enter Name");    
};

ko.applyBindings(new firstViewModel(), document.getElementById("firstSection"));
ko.applyBindings(new secondViewModel(), document.getElementById("secondSection"));