JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<select id="foo1">
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>
<select id="foo2">
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>

JavaScript

var $foo1 = $('#foo1').selectmenu({
	change: function() {
  	console.log(1);
  },
});
$foo1.val(2).selectmenu('refresh');
$foo1.trigger('selectmenuchange');
$foo1.trigger('change');

var $foo2 = $('#foo2').selectmenu()
.on('selectmenuchange', function() {
  	console.log(2);
});
$foo2.val(2).selectmenu('refresh');
$foo2.trigger('selectmenuchange');