查询选择选项不会附加到选择

Question

在脚本中接收JSOn响应

[{"text": "alpha","selected": false},
 {"value": 2, "text": "beta", "selected": false },
 {"value": 3, "text": "delta", "selected": false }]

我正在尝试生成相应的选项并将它们插入模态窗口

    <!-- Groups Modal -->
<div class="modal fade" id="groupsModal" tabindex="-1" access_level="dialog" aria-labelledby="groupsModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
      <select multiple="multiple" id="groups-selector" name="user-groups[]"></select>
        </div>
    </div>
</div>

我写了这个函数：

   function initGroupSelect(groups) {
     var options = "";
     $.each(groups, function(index, group) {  
       options += "<option value='"+group["value"]+"'>"+group["text"]+"</option>";
     });
     console.log("options:  "+ options);
     $('#groupsModal div.modal-content select').append(options);
   }

当我显示模态时，其中没有选项（html源中没有选项）

控制台显示正确的选项字符串：

options:  <option value='1'>alpha</option><option value='2'>beta</option><option value='3'>delta</option>

缺少什么？ 感谢您的反馈

=== update 1 initiGroupSelect函数被调用：

  $('#user-addTool').on('click', function(e) {
    $('#groups-selector').multiSelect(); // init the group selector in groups modal
    var ajaxUrl = "http://" + window.location.host + "/users/new.json";
    e.preventDefault();
    e.stopPropagation();
    $.get(ajaxUrl, function(data){
      $('#userModal div.modal-content').html(data["html"]);  // fill inthe user form modal
      initGroupSelect(data["groups"]);   // fill in the groups modal    
    });    
    $('#userModal').modal('show');  // show user form
    $('#groupsModal').modal('show');  // test only, should be hidden
  });