I'm running into a very weird issue with a Semantic UI multi-select searchable dropdown.

Basically, I'm able to add and delete items from the dropdown without any problem. However, while adding items consistently triggers the onChange jQuery listener, there are times where deleting items does not trigger the onChange jQuery listener. The listener is not triggered when deleting dropdown options that have a comma (e.g., selecting "Tokyo, Japan" from the dropdown will trigger the listener - so far so good, the listener is always triggered with added elements - but when we click "X" to erase this option, it is deleted, but the listener is not triggered.

To be clear, I can delete items with commas in their text, but it does not trigger the onChange listener when it should.

The dropdown is illustrated below with 3 possible options: dropdown image

My code looks like:

HTML (note that the possible dropdown options are added dynamically through JS during runtime and that the options are added adequately, as the picture shows):

    <div class="ui fluid search selection dropdown" id="myid">
        <input type="hidden" name="">
        <i class="dropdown icon"></i>
        <div class="default text">Some default text</div>
        <div class="menu">
        </div>
    </div>

JS:

$('.ui.dropdown').dropdown({ // SEMANTIC UI LISTENER
    onChange: function() {console.log("triggered")}
});

Notice the onChange listener - it is this listener that I thought would be triggered whenever we delete or select items from the dropdown. The way I detect whether it is triggered is simply through console logging.

Any advice is appreciated.