jQuery UI selectmenu не выбирает

В настоящее время я пытаюсь создать рабочее меню выбора с помощью jQuery-UI. Мой выбор выглядит нормально, но когда я пытаюсь выбрать значение, ничего не меняется: выбор остается открытым, а значение изменяется при наведении, а не при нажатии. Я вообще не понимаю, что происходит.

Я использую jQuery 1.10.2 и jQuery-UI 1.11.4.

Вот мой (отображенный) HTML:

<div class="form-group">
                          <table class="table m-full-background-color-table">
                            <thead>
                              <tr>
                                <th></th>
                                <th>Disposition</th>
                                <th>Participants</th>
                              </tr>
                            </thead>
                            <tbody id="sallesConteneur">
                              <tr class="header-spacing">
                                <td></td>
                              </tr>
                              <tr data-indice="1">
                                <td>Salle de réunion 1</td>
                                <td>
                                  <select class="form-control" name="salles[1][disposition]" id="roomTypeSelect" style="display: none;">
                                    <option value="En U" style="padding-left:30px;background-image: url('/images/capacity_icons/IconesBizMeeting_14.gif');">En U</option>
                                    <option value="Banquet">Banquet</option>
                                    <option value="Cocktail">Cocktail</option>
                                    <option selected="selected" value="Theatre">Theatre</option>
                                    <option value="Board">Board</option>
                                    <option value="Conference">Conférence</option>
                                    <option value="Class">Classe</option>
                                  </select><span class="ui-selectmenu-button ui-widget ui-state-default ui-corner-all" tabindex="0" id="roomTypeSelect-button" role="combobox" aria-expanded="false" aria-autocomplete="list" aria-owns="roomTypeSelect-menu" aria-haspopup="true" style="width: 210px;" aria-activedescendant="ui-id-7" aria-labelledby="ui-id-7" aria-disabled="false"><span class="ui-icon ui-icon-triangle-1-s"></span><span class="ui-selectmenu-text">Classe</span></span>
                                </td>
                                <td>
                                  <input type="number" min="0" value="13" class="form-control input-sm" name="salles[1][participants]">
                                </td>
                              </tr>

                            </tbody>
                          </table>

                          <span><a class="btn btn-primary pull-right" id="newSalle" alt="" href="#"><i class="fa fa-plus"></i> Ajouter une salle</a><span class="light-text small-text pull-right l-tip">Vous souhaitez plusieurs salles ? Cliquez sur le bouton ci-contre</span></span>
                        </div>

А вот мой код javascript (в $(function(){):

$.widget( "custom.iconselectmenu", $.ui.selectmenu, {
  _renderItem: function( ul, item ) {
    var li = $( "<li>", { text: item.label } );

    if ( item.disabled ) {
      li.addClass( "ui-state-disabled" );
    }

    $( "<span>", {
      style: item.element.attr( "data-style" ),
      "class": "ui-icon " + item.element.attr( "data-class" )
    })
      .appendTo( li );

    return li.appendTo( ul );
  }
});
$("#roomTypeSelect").iconselectmenu().iconselectmenu("menuWidget").addClass("ui-menu-icons");

Кто-нибудь знает, почему это не работает?

Спасибо хорошего дня