Javascript 单击按钮即可删除

我有一个部分，用户可以通过输入文本并单击添加按钮来添加标签。添加标记后，将显示一个删除按钮，以便用户可以添加或删除标记。我已经创建了JavaScript代码，允许用户添加下面正在使用的标记。但是，我不知道如何允许用户在单击“删除”按钮时删除标记。任何帮助都将不胜感激

if($("#addTag").length>0){

    $("#addTag").click(function(){

        var tag = $("#tag").val()
        var campaign_tags =  JSON.parse($("#campaign_tags").val())

        if(tag==''){
            alert('no text added')
        }
        else{
            //add check to see if the tag is already added
            if(jQuery.inArray(tag, campaign_tags)==-1)
            {

              var tag_html = "<div class='campaign_tags'><small>"+tag+"</small><div class='campaign_btn remove_tag'>x</div></div>"

              $("#tag_container").append(tag_html)

              //now add the tag to the array
              campaign_tags.push(tag)
              $("#campaign_tags").val(JSON.stringify(campaign_tags))

              //re-initialize the delete function
              init_remove_tag()

            }


        }   
    })  
}   

if（$（“#addTag”）.length>0）{
$（“#addTag”）。单击（函数（）{
var tag=$（“#tag”）.val（）
var campaign_tags=JSON.parse（$（“#campaign_tags”）.val（））
如果（标记=“”）{
警报（'未添加文本'）
}
否则{
//添加检查以查看是否已添加标记
if（jQuery.inArray（标记，活动标记）=-1）
{
var tag_html=”“+tag+“x”
$（“#标记容器”）.append（标记html）
//现在将标记添加到数组中
活动标签。推送（标签）
$（“#活动标签”）.val（JSON.stringify（活动标签））
//重新初始化delete函数
初始化删除标记（）
}
}   
})  
}   

单击删除按钮将调用下面的代码。它将找到

campaign\u标签

div并将其删除

$(document).on("click", ".remove_tag", function(){
    $(this).parents(".campaign_tags").remove();
});

编辑

正如@Blazemonger所建议的那样，

.closest（）

是一个更好的选择

$(document).on("click", ".remove_tag",function(){
    $(this).closest(".campaign_tags").remove();
});

将目标定为

$（“#标记容器”）

（最接近的永久祖先）而不是

$（文档）