Javascript 可以用append添加div吗？这样？

我有这个样本：

代码HTML:

<button class="add">add</button>
<button class="remove">remove</button>

 <div class="row" id="container-rec">
            <div class="col-md-12">
                  <label for="clg_email">Email</label>
                  <input type="text" name="clg['email'][]" id="clg_email">
            </div>
            <div class="col-md-12">
                  <label for="clg_email">Email</label>
                  <input type="text" name="clg['email'][]" id="clg_email">
            </div>
            <div class="col-md-12">
                   <label for="clg_email">Email</label>
                   <input type="text" name="clg['email'][]" id="clg_email">
            </div>
            <div class="col-md-12">
                     <label for="clg_email">Email</label>
                     <input type="text" name="clg['email'][]" id="clg_email">
            </div>
            <div class="col-md-12">
                      <label for="clg_email">Email</label>
                      <input type="text" name="clg['email'][]" id="clg_email">
             </div>
 </div>

$('#add_new_rec').click(function (e) {
    // custom handling here
        e.preventDefault();
        $('.add').append('//my row');
});


$('.remove').click(function (e) {
     $(".remove").remove("//remove my last row")
});

.row{
  display:none
}

编码CSS:

<button class="add">add</button>
<button class="remove">remove</button>

 <div class="row" id="container-rec">
            <div class="col-md-12">
                  <label for="clg_email">Email</label>
                  <input type="text" name="clg['email'][]" id="clg_email">
            </div>
            <div class="col-md-12">
                  <label for="clg_email">Email</label>
                  <input type="text" name="clg['email'][]" id="clg_email">
            </div>
            <div class="col-md-12">
                   <label for="clg_email">Email</label>
                   <input type="text" name="clg['email'][]" id="clg_email">
            </div>
            <div class="col-md-12">
                     <label for="clg_email">Email</label>
                     <input type="text" name="clg['email'][]" id="clg_email">
            </div>
            <div class="col-md-12">
                      <label for="clg_email">Email</label>
                      <input type="text" name="clg['email'][]" id="clg_email">
             </div>
 </div>

$('#add_new_rec').click(function (e) {
    // custom handling here
        e.preventDefault();
        $('.add').append('//my row');
});


$('.remove').click(function (e) {
     $(".remove").remove("//remove my last row")
});

.row{
  display:none
}

如何按我的要求添加新行？ 基本上我想要一个好的解决方案来解决这个问题

我不想

$('#mydiv').append('//some code HTML');

你能帮我解决这个问题吗？ 基本上我想在每个键点击“添加”后添加一行，至少点击“删除”后删除

---

提前谢谢

下面是将

• 通过克隆隐藏的div添加具有输入的div
• 更改关联的ID
• 单击“删除”时删除最后一个

$（函数（）{
$（“#添加”）。在（“单击”，函数（）{
var$container=$（“#container rec”）；
var idx=$container.children（）.length；//有多少子级
var$div=$（“#orgDiv”）.clone（）；//复制
$div.prop（“id”，“div”+idx）；
$div.find（“标签”）。每个（函数（）{
$（this.prop（“for”，$（this.next（）.prop（“id”）+idx）；//更改id
})  
$div.find（“输入”）。每个（函数（）{
$（this.prop（“id”，$（this.prop（“id”）+idx）；//更改id
})  
$container.append（$div）；
});
$（“#删除”）。在（“单击”，函数（）{
var$divs=$（“#容器记录”）.find（“.col-md-12”）；
$divs.last（）.remove（）；
});
});
#orgDiv{display:none}

添加
去除
名称


电子邮件
为什么不想使用append（）？。。。“我不知道还有什么功能我们用的是别的？”马吕斯我们想要实现的是可能的，但为什么你要把它附加到按钮上。让我们来看看。