JSFiddle - React, Tailwind, and code Playground

HTML

<select name="country" id="country">
	<option value="ua">Ukraine</option>
	<option value="ru">Russia</option>
</select>


<select name="currency" id="currency">
	<option value="grn">Grivna</option>
	<option value="rub">Rub</option>
</select>

JavaScript

var mediator = (function () {'use strict'; var events; events = {}; return {subscribe : function (event_name, callback) {if (!events[event_name]) {events[event_name] = []; } events[event_name].push(callback); }, unsubscribe : function (event_name, callback_) {if (arguments.length === 1) {delete events[event_name]; } else {if (events[event_name]) {events[event_name] = events[event_name].filter(function (callback) {return callback !== callback_; }); } } }, publish : function (event_name, data) {var callbacks; var i; callbacks = events[event_name]; if (callbacks && callbacks.length) {for (i = 0; i < callbacks.length; i += 1) {callbacks[i].call(undefined, data); } } } } }());

$('#country').on('change', function () {
    mediator.publish('country', {val : getSelected(this).val()})
});

$('#currency').on('change', function () {
    mediator.publish('currency', {val : getSelected(this).val()})
});

function getSelected (node) {
	return $(node).find(':selected').eq(0);
}

mediator.subscribe('country', function (data) {
    if (data.val === 'ua') {
   		$('#currency').find('[value="grn"]').prop('selected', true);
    } else if (data.val === 'ru') {
   		$('#currency').find('[value="rub"]').prop('selected', true);
    }
});