JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://davidstutz.github.io/bootstrap-multiselect/js/bootstrap.min.js"></script>
<script src="http://davidstutz.github.io/bootstrap-multiselect/js/bootstrap-multiselect.js"></script>
<link rel="stylesheet" href="http://davidstutz.github.io/bootstrap-multiselect/css/bootstrap.min.css">
<p>Choose some countries you'd like to visit:
    <select id="countries" data-bind="value: selectedCountries, options: availableCountries, selectedOptions: chosenCountries," multiple="multiple"></select>
</p>
<p data-bind="text: selectedCountries"></p>
<p>Choose some countries you'd like to visit:
    <select id="countries2" data-bind="value: selectedCountriesTwo, options: availableCountriesTwo, selectedOptions: chosenCountriesTwo" multiple="multiple"></select>
</p>
<p data-bind="text: selectedCountriesTwo"></p>

JavaScript

$('#countries').multiselect();

var viewModel = {
    availableCountries: ko.observableArray(['France', 'Germany', 'Spain']),
    selectedCountries: ko.observableArray([]),
    chosenCountries: ko.observableArray(['Germany']), // Initially, only Germany is selected
    
    availableCountriesTwo: ko.observableArray(['France', 'Germany', 'Spain']),
    selectedCountriesTwo: ko.observableArray([]),
    chosenCountriesTwo: ko.observableArray(['Spain']) // Initially, only Spain is selected
};

ko.applyBindings(viewModel);

/*
Works:
Selecting something in the 2nd multiple select

Doesn't work:
Selecting multiple items in the 2nd select
Selecting anything in the 1st select

What I want:

just get a callback when items are selected, with all items.
*/