使用Jquery删除所选项目（不在选项字段内）

Question

我有一个菜单列表，看起来像下面的图像这些值是从DB绑定的，如果我选择任何一个项目应该删除该元素。我怎么做？

这是我的jquery代码

$.get(url, function (d) {
  self.dt = [];
  self.firmData = JSON.parse(d.Data);
  self.firmData.forEach(function (data) {
  $("#itemlists").append("<div class='item'>" + data.DisplayName + "</div>");
  self.dt.push(data.DisplayName);
   });
 });

这是我的HTML：

<div class="active content menu scrollbar" style="max-height:365px; overflow:auto;">
    <div id="itemlists" style="z-index:999" class="ui divided selection list">
    </div>
</div>

现在这些值来自api，如果我选择任何一个项目并尝试删除它。它删除了我想删除它的所有项目只选择了项目。我怎么做？

编辑

    "click #itemlists .item": function (e) {
         var text = $(e.target).text()
         $(this).remove();
    },

我尝试使用上面的方法，但这也删除了所有项目

Answer 1

当点击class ='item'元素时，它将被删除。

$(".item").on( "click", function() {
  $(this).remove();
});

Answer 2

首先，我正在录制所选文字

var text = $(selectedOpts).val();

然后从this.data过滤数据并将其传递给变量removeItem

const removeItem = value => this.data.filter(item => item.columnsexpo != value)

现在我将值分配给this.data as

this.data = removeItem(text)

现在this.data包含已删除的项目，仅显示我们需要的数据