jQuery按顺序删除附加的div元素

我正在创建一个注册表，用户可能需要输入多达10个董事的详细信息。首先，我只想显示一组导演问题，如果需要，用户可以单击“+导演”添加更多详细信息

这将向.director\u包装器追加一个div（这很好）。但是，我还想包括一个remove按钮，以防它们将太多的director类附加到父元素中

到目前为止，我的代码在单击“-director”按钮时删除了一个div，但我不明白为什么它只删除一个，而在单击时不继续删除其他div

var-director=$（'.director'）；
var dirClone=$（'.director'）.html（）；
var wrapper=$（'.director_wrapper'）；
var计数=1；
var maxField=10；
var removeBtn=$（'.remove_dir'）；
$（'.add_dir'）。在（'click'，函数（e）上{
e、 防止违约；
如果（计数<最大字段）{
$（包装器）.append（dirClone）；
计数++；
$（removeBtn）.removeClass（'disabled'）；
};
});
$（移除BTN）。单击（'单击'，函数（e）{
e、 防止违约；
$（'.director\u包装器div.director:last'）.remove（）；
计数--；
控制台日志（计数）；
});


董事详情
+导演
-导演
经理
问题在于您的第二行：
$（'.director'）.html（）
.html（）
仅获取元素的内部html。有一个名为
outerHTML
的DOM属性，您可以使用它来获取正确的HTML


var-director=$（'.director'）；
var dirClone=$（'.director'）.prop（'outerHTML'）；
var wrapper=$（'.director_wrapper'）；
var计数=1；
var maxField=10；
var removeBtn=$（'.remove_dir'）；
$（'.add_dir'）。在（'click'，函数（e）上{
e、 防止违约；
如果（计数<最大字段）{
$（包装器）.append（dirClone）；
计数++；
$（removeBtn）.removeClass（'disabled'）；
};
});
$（移除BTN）。单击（'单击'，函数（e）{
e、 防止违约；
$（'.director\u包装器div.director:last'）.remove（）；
计数--；
控制台日志（计数）；
});


董事详情
+导演
-导演
经理
问题在于您的第二行：
$（'.director'）.html（）
.html（）
仅获取元素的内部html。有一个名为
outerHTML
的DOM属性，您可以使用它来获取正确的HTML


var-director=$（'.director'）；
var dirClone=$（'.director'）.prop（'outerHTML'）；
var wrapper=$（'.director_wrapper'）；
var计数=1；
var maxField=10；
var removeBtn=$（'.remove_dir'）；
$（'.add_dir'）。在（'click'，函数（e）上{
e、 防止违约；
如果（计数<最大字段）{
$（包装器）.append（dirClone）；
计数++；
$（removeBtn）.removeClass（'disabled'）；
};
});
$（移除BTN）。单击（'单击'，函数（e）{
e、 防止违约；
$（'.director\u包装器div.director:last'）.remove（）；
计数--；
控制台日志（计数）；
});


董事详情
+导演
-导演
经理
为我删除了所有这些。。您使用的浏览器和平台是什么？不相关（可能），但您有许多重复的id是BAAAD，可能值得将它们转换为类。同意@DBS，请确保模板HTML没有id，或者您更改每个克隆的id。请为我删除所有id。。您使用的浏览器和平台是什么？不相关（可能），但您有很多重复的id是BAAAD，可能值得将它们转换为类。同意@DBS，请确保模板HTML没有id或更改每个克隆的id。