jQuery追加html元素，但每次都使用不同的类名

我正在为我的网站创建一个站点地图功能，我有一个功能，它附加了一个新的选择框，有多个选项，我有一个删除功能，它将删除选择框

我说移除选择框，但它实际做的是移除所有创建的选择框，但是我希望它以与之相关的选择框为目标

我相信实现这一点的一种方法是为selectbox元素指定一个不同的类，有人知道我如何做到这一点吗

或者有人能推荐一种更好的方法来处理这个问题吗

到目前为止，我的代码在下面，或者查看我的

$（“#新闻下级”）。单击（函数（）{
$（“.navoptions”）.append（“
home”）；
});
$（“.navoptions”）。在（'click'，'.remove'，function（）上{
$（“.newoption.remove”）.remove（）；
});

add.html

<div class="maincontent">
<h2 class="sitemaphead">Sitemap</h2>
<p>Add a sub level to About.</p>
<div class="navoptions">
<select>
<option value-"Home">Home</option>
<option value-"Home">Home</option>
<option value-"Home">Home</option>
<option value-"Home">Home</option>
<option value-"Home">Home</option>
<option value-"Home">Home</option>
<option value-"Home">Home</option>
</select>
</div>
<p id=""><a href="#" id="newsublevel">Click here</a> to add another sub level</p>

</div>

网站地图
将子级别添加到“关于”

家
家
家
家
家
家
家
添加另一个子级别

这应该行得通

$("#newsublevel").click(function() {
    $(".navoptions").append('<div><select class="newoption"><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option></select><a href="#" class="remove">Remove</a></div>');
});

$(".navoptions").on('click','.remove',function() {
    $(this).closest('div').remove()
});

$（“#新闻下级”）。单击（函数（）{
$（“.navoptions”）.append（'home'）；
});
$（“.navoptions”）。在（'click'，'.remove'，function（）上{
$（this）.closest（'div'）.remove（）
});

我添加了一个container div元素。单击remove按钮，代码将找到container元素，并且只删除该元素

以下是更新的JSFIDLE

，应该可以使用

$("#newsublevel").click(function() {
    $(".navoptions").append('<div><select class="newoption"><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option></select><a href="#" class="remove">Remove</a></div>');
});

$(".navoptions").on('click','.remove',function() {
    $(this).closest('div').remove()
});

$（“#新闻下级”）。单击（函数（）{
$（“.navoptions”）.append（'home'）；
});
$（“.navoptions”）。在（'click'，'.remove'，function（）上{
$（this）.closest（'div'）.remove（）
});

我添加了一个container div元素。单击remove按钮，代码将找到container元素，并且只删除该元素

这里是更新后的JSFIDLE

实际上，通过使用表单中的元素，您可以对希望“相关”的所有

语句执行分组，并同时控制它们。更深入地说，如果您可以跟踪动态添加到的组的索引，您可以使用这些索引来清除它们，而不必使用唯一类来区分它们。

实际上，通过使用表单中的元素，您可以对所有希望“相关”的

语句进行分组，并一次对它们进行控制。更深入地说，如果您可以跟踪动态添加到的组的索引，您可以使用这些相同的索引来清除它们，而无需使用唯一类来区分它们。

尝试以下方法：

$(".navoptions").on('click','.remove',function() {
    $(this).prev().andSelf().remove();       
});

试试这个：

$(".navoptions").on('click','.remove',function() {
    $(this).prev().andSelf().remove();       
});

试试这个：- JS:-

$(function() {

        $("#newsublevel").click(function() {
            $(".navoptions").append('<div><br/><select class="newoption"><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option></select><a href="#" class="remove">Remove</a></div>');
        });

    $(".navoptions").on('click','.remove',function() {
        $(this).parent().remove();
    });

});

$（函数（）{
$（“#新闻下级”）。单击（函数（）{
$（“.navoptions”）.append（“
home”）；
});
$（“.navoptions”）。在（'click'，'.remove'，function（）上{
$（this.parent（）.remove（）；
});
});

试试这个：- JS:-

$(function() {

        $("#newsublevel").click(function() {
            $(".navoptions").append('<div><br/><select class="newoption"><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option><option value="Home">Home</option></select><a href="#" class="remove">Remove</a></div>');
        });

    $(".navoptions").on('click','.remove',function() {
        $(this).parent().remove();
    });

});

$（函数（）{
$（“#新闻下级”）。单击（函数（）{
$（“.navoptions”）.append（“
home”）；
});
$（“.navoptions”）。在（'click'，'.remove'，function（）上{
$（this.parent（）.remove（）；
});
});

感谢您的输入@Parv，但这仍然会删除每个选择框，我希望它删除我单击“删除”的选择框，因此我相信我需要一个唯一的标识。这样的页面对我很有用，因为添加的选择被包装在一个div中，如果需要，甚至可以在该div中添加一个类。感谢您的输入@Parv，但是这仍然会删除每个选择框，我希望它删除我已单击“删除”的选择框，因此我相信我需要一个独特的标识符，这样的书对我很有用，因为添加的选择被包装在一个div中，如果需要的话，我甚至可以在该div中添加一个类。这很有效，谢谢你，但是我已经接受了下面的答案，但仍然会+1你，因为这是一个同样好的答案！不需要

如果它被包装在像div一样的块元素中，它会看起来很有效谢谢你，但是我已经接受了下面的答案，但仍然会+1你，因为这是一个同样好的答案！不需要

如果它像div一样被包装在一个块元素中，那么它看起来会在得到的added中留下额外的

，在得到的added中留下额外的