Semantic-UI: Dynamically added item to dropdown can't be selected

I am trying to dynamically add items to dropdown but when items are added, they can't be selected. Here is what I've done so far:

html:

<select name="tags" multiple="" class="ui fluid dropdown">
<option value="" >Enter some tags</option>
  <option value="css">css</option>
  <option value="html">html</option>
</select>

js:

$dropdown = $('.ui.dropdown');

$dropdown.dropdown({
    maxSelections: 3
});

$dropdown.dropdown('add optionValue', 'ruby');
$dropdown.dropdown('add optionValue', 'python');

$dropdown.dropdown('set selected', ['css', 'html', 'python', 'ruby']);

css and html are selected but ruby and python aren't while ruby and python are added to dropdown and you can select them manually. You can find the jsfiddle at here.

Also I've seen following question: Semantic-UI Dynamic Dropdown but I don't think it's a good way to add items to dropdowns.