JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js"></script>
<script src="https://raw.github.com/SteveSanderson/knockout.mapping/master/build/output/knockout.mapping-latest.debug.js"></script>
<div data-bind="with: leftOprands">
        <select data-bind="options: ApplicableOperators, optionsText: 'OperatorName', value: $root.conditionOperatorSelected, optionsCaption: 'Choose...'"></select>
    </div>
<input type="button" data-bind="click: logModel" value="log model"/>

JavaScript

$(function() {
    var viewModel = function() {
    var self = this;
    self.leftOprands = ko.mapping.fromJS(Oprands);
    self.leftOprandsSelected = ko.observable();
    self.conditionOperatorSelected = ko.observable();
    self.ruleconditionRhsTmpl = ko.computed(function() {
        if (self.conditionOperatorSelected()) {
            return self.conditionOperatorSelected().DisplayType;
        }
    });
    //debug
    self.logModel = function() {
        console.log(typeof ruleconditionRhsTmpl());
    };
}
    ko.applyBindings(viewModel);

});
//sample data
var Oprands = [{
    "OperandID": 1,
    "OperandName": "Order Modality",
    "ApplicableOperators": [{
        "OperatorName": "IS",
        "DisplayType": 3
    },
    {
        "OperatorName": "IS ONE OF",
        "DisplayType": 5
    }],
    "IsRequiresList": true,
    "OperandDataType": "long",
},
{
    "OperandID": 2,
    "OperandName": "Order Criticality",
    "ApplicableOperators": [{
        "OperatorName": "IS",
        "DisplayType": 3
    },
    {
        "OperatorName": "IS ONE OF",
        "DisplayType": 5
    }],
    "IsRequiresList": true,
    "OperandDataType": "long",
},
{
    "OperandID": 3,
    "OperandName": "Total Read Count",
    "ApplicableOperators": [{
        "OperatorName": "=",
        "DisplayType": 0
    },
    {
        "OperatorName": ">",
        "DisplayType": 0
    },
    {
        "OperatorName": ">=",
        "DisplayType": 0
    },
    {
        "OperatorName": "<",
        "DisplayType": 0
    },
    {
        "OperatorName": "<=",
        "DisplayType": 0
    }],
    "IsRequiresList": false,
    "OperandDataType": "int",
    "ListSourceInfo": ""
},
{
    "OperandID": 4,
    "OperandName": "Current Read Number",
    "ApplicableOperators": [{
        "OperatorName": "=",
        "DisplayType": 0
    },
    {
        "OperatorName": ">",
        "DisplayType": 0
    },
    {
        "OperatorName": ">=",
        "DisplayType": 0
    },
    {
        "OperatorName":...