JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-min.js"></script>
<input type='text' data-bind='value: selectedItem' />
<input type='button' data-bind='click: addItem' value='add' />
<pre>vm = <span data-bind="text: ko.toJSON($root, null, 4)"></span></pre>

JavaScript

$(document).ready(function () {
    var BaseVM = function () {
        var that = {};
        return that;
    };
    var TestVM = function () {
        var that = BaseVM();
        that.relatedItems = ko.observableArray(['pork', 'ham']);
        that.selectedItem = ko.observable('');
        that.addItem = function () {
            if (that.relatedItems().indexOf(that.selectedItem()) >= 0) {
                alert('existed');
            } else {
                that.relatedItems().push(that.selectedItem());
            }
        };
        that.removeItem = function () {
            if (that.relatedItems().indexOf(that.selectedItem()) >= 0) {
                that.relatedItems().remove(that.selectedItem());
            }
        };
        return that;
    };
    var vm = TestVM();
    ko.applyBindings(vm);
});