Jquery克隆对克隆元素

Question

我在克隆JQuery中的HTML元素时遇到了问题：

var original = $('#malts-menus1');

var newID = "malts-menus" + malt_counter;
var clone = original.clone(true, true);

$('#malts-container').append(clone.prop('id', newID));

clone.children('.control-group').first().children('label').text('Malt ' + malt_counter);
clone.children('.control-group').first().children('.controls').first().attr('id', 'select0' + malt_counter);

此脚本应该克隆#malts-menus并将其附加到#malts-container

<div class="malts-container" id="malts-container">
  <div class="malts-menus" id="malts-menus1">
    <div class="control-group">
      <label class="control-label" for="select01">Malt 1</label>
      <div class="controls">
        <select name="malt" id="select01" 
                class="chzn-select malt-select">

          <c:forEach items="${maltList}" var="malt">
            <option value="${malt.getIng_Id()}">Malt
              ${malt.getMalt_cereale()} ${malt.getMalt_type()}
            </option>
          </c:forEach>

        </select>
      </div>
    </div>
    <div class="control-group">
      <label class="control-label" for="select01">Quantité (kg)</label>
      <div class="controls">
        <input name="maltQte" class="input-xlarge focused"
               id="focusedInput" type="text" value="10">
      </div>
    </div>
  </div>
</div>
<div class="control-group">
  <label class="control-label" for="select01">Ajouter un malt</label>
  <div class="controls">
    <button type="button" class="btn btn-mini"
            onclick="addABlock(0);">+</button>
  </div>
</div>

......确实如此。但是，当我单击菜单时，将打开第一个菜单而不是选定的菜单。

看起来克隆元素仍然是指第一个元素。

如何克隆新对象并将其作为独立对象插入？

在这里，我点击了麦芽3：