JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<div id="person">
    <div>
        <label for"firstName">First Name:</label>
        <input type="text" id="firstName" data-bind="value:firstName"/>
    </div>
    <div>
        <label for"lastName">Last Name:</label>
        <input type="text" id="lastName" data-bind="value:lastName"/>
    </div>
</div>
<div id="subscription">
    <div>
        <label for"subscriptionLevel">Subscription Level:</label>
        <select id="subscriptionLevel" data-bind="value: subscriptionLevel">
            <option value="trial">Trial</option>
            <option value="basic">Basic</option>
            <option value="premier">Premier</option>
        </select>
    </div>
</div>
<button type="button" id="save">Save</button>

JavaScript

var ViewModel1 = function() {
    var self = this;
    self.firstName = ko.observable('');
    self.lastName = ko.observable('');
    
    self.firstName('John');
    self.lastName('Doe');
    
    self.Save = function () {
        alert(ko.toJSON(self));
    };
};
ko.applyBindings(new ViewModel1(), document.getElementById("person"));

var ViewModel2 = function() {
    var self = this;
    self.subscriptionLevel = ko.observable('');
    
    self.subscriptionLevel('premier');
    
    self.Save = function () {
        alert(ko.toJSON(self));
    };
};
ko.applyBindings(new ViewModel2(), document.getElementById("subscription"));

$('#save').on('click', function() {

});