jquery - ボタンのクリックでdivを複製する必要があるjQueryコードを記述します。新しい div には新しいドロップダウン リストが必要です

Question

Jクエリ:

 $("#panel_moreInfoDetails_common3").clone().appendTo("#panel_moreInfoDetails_common2");

div を複製することはできますが、ドロップダウン リストが必要です。ドロップダウン オプションが foreach ループにあることに注意してください。HTML は HTML の下に表示されます。

<div class="row" id="panel_moreInfoDetails_common3">
     <div class="delete-moreinfodetails" style="margin-left: 15px;margin-top: 20px;margin-right: 18px;">
         <a data-id="@record.UserFieldIndexNumber" id="button-delete-moreinfodetails" href="javascript:void(0)">
            <i class='icon icon-bin3'></i>
         </a>
     </div>
     <div id="@string.Format("field_{0}_{1}", Model.Page, record.UserFieldIndexNumber)" class="col settings-field @(fields.Contains(string.Format("field_{0}_{1}", Model.Page, record.UserFieldIndexNumber)) ? "hidden" : "")">
        <select class="moreinfo-details" id="@string.Format("field_{0}_{1}", Model.Page, record.UserFieldIndexNumber)" name="@string.Format("field_{0}_{1}", Model.Page, record.UserFieldIndexNumber)" data-field="Info Details">
             <option value="">Select an option</option>
             @foreach (var item in Model.MoreInfoDetailsValues)
             {
                   //selected = record.UserDefinedDropDownField == item.UserDefinedDropDownField ? "selected='selected'" : "";
                   <option data-desc="@item.UserDefinedDropDownField" @selected value="@item.UserDefinedDropDownField">@item.UserDefinedDropDownField</option>
             }
        </select>
     </div>
     <div id="@string.Format("field_{0}_{1}", Model.Page, record.UserFieldIndexNumber)" class="col settings-field @(fields.Contains(string.Format("field_{0}_{1}", Model.Page, record.UserFieldIndexNumber)) ? "hidden" : "")">

          <input data-ufindex="@record.UserFieldIndexNumber" type="text" class="form-control" value="@record.UserFieldValue" />

     </div>
</div>