JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://knockoutjs.com/downloads/knockout-3.0.0.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/chosen/1.0/chosen.jquery.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<form action="#">
    <fieldset>
        <div class="form-group">
            <label for="#option1">Choose option</label>
            <div class="col-md-3">
                <select id="option1" class="form-control" data-bind="chosen: payoutOptions, optionsText: 'optionText', optionsValue: 'optionValue', value: activePayoutOption"></select>
            </div>
        </div>
        <div class="form-group">
            <label for="#option2">Choose country</label>
            <div class="col-md-3">
                <select id="option2" class="form-control" data-bind="chosen: countries, value: activeCountry, optionsCaption: 'Select country'"></select>
            </div>
        </div>
        <!-- ko if: activeCountry -->
        <div class="form-group">
            <label for="#option3">Choose method</label>
            <div class="col-md-3">
                <select id="option3" class="form-control" data-bind="value: activeMethod, chosen: availableMethods"></select>
            </div>
        </div>
        <!-- /ko -->
    </fieldset>
</form>

CSS

.chosen-container{position:relative;display:inline-block;vertical-align:middle;font-size:13px;zoom:1;*display:inline;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.chosen-container .chosen-drop{position:absolute;top:100%;left:-9999px;z-index:1010;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:100%;border:1px solid #aaa;border-top:0;background:#fff;-webkit-box-shadow:0 4px 5px rgba(0,0,0,.15);box-shadow:0 4px 5px rgba(0,0,0,.15)}.chosen-container.chosen-with-drop .chosen-drop{left:0}.chosen-container a{cursor:pointer}.chosen-container-single .chosen-single{position:relative;display:block;overflow:hidden;padding:0 0 0 8px;height:34px;border:1px solid #aaa;-webkit-border-radius:5px;border-radius:5px;background-color:#fff;background:-webkit-gradient(linear,50% 0%,50% 100%,color-stop(20%,#fff),color-stop(50%,#f6f6f6),color-stop(52%,#eee),color-stop(100%,#f4f4f4));background:-webkit-gradient(linear,left top,left bottom,color-stop(.2,#fff),color-stop(.5,#f6f6f6),color-stop(.52,#eee),color-stop(1,#f4f4f4));background:-webkit-linear-gradient(top,#fff 20%,#f6f6f6 50%,#eee 52%,#f4f4f4 100%);background:-moz-linear-gradient(top,#fff 20%,#f6f6f6 50%,#eee 52%,#f4f4f4 100%);background:-o-linear-gradient(top,#fff 20%,#f6f6f6 50%,#eee 52%,#f4f4f4 100%);background:-ms-linear-gradient(top,#fff 20%,#f6f6f6 50%,#eee 52%,#f4f4f4 100%);background:linear-gradient(top,#fff 20%,#f6f6f6 50%,#eee 52%,#f4f4f4 100%);-webkit-background-clip:padding;-moz-background-clip:padding;background-clip:padding-box;-webkit-box-shadow:0 0 3px #fff inset,0 1px 1px rgba(0,0,0,.1);box-shadow:0 0 3px #fff inset,0 1px 1px rgba(0,0,0,.1);color:#444;text-decoration:none;white-space:nowrap;line-height:33px}.chosen-container-single .chosen-default{color:#999}.chosen-container-single .chosen-single...

JavaScript

function PayoutsViewModel() {
    var self = this;
	self.payoutOptions = [
        {
            "optionText": "New payout method",
            "optionValue": "new"
        }
	];
    self.countries = ["Afghanistan","Albania"];
    self.countriesMeta = {
        "Afghanistan": {
            "methods": [
                "cash",
                "paypal",
                "wire"
            ]
        },
        "Albania": {
            "methods": [
                "cash"
            ]
        }
    };

    self.activePayoutOption = ko.observable("");
    
    self.activeMethod = ko.observable("");

    self.activeCountry = ko.observable("");
    
    self.availableMethods = ko.computed(function(){
        if (self.activeCountry()) {
            return self.countriesMeta[self.activeCountry()]["methods"]            
        }
    }, this);
    
};

ko.bindingHandlers.chosen = {
  init: function(element)  {
    ko.bindingHandlers.options.init(element);
    $(element).chosen({disable_search_threshold: 10});
  },
  update: function(element, valueAccessor, allBindings) {
     ko.bindingHandlers.options.update(element, valueAccessor, allBindings);
    $(element).trigger('chosen:updated');
  }
};

ko.applyBindings(new PayoutsViewModel());