单击列表中的多个项目，同一个类不起作用

Question

我在删除列表中的项目之前使用此代码要求确认：

HTML

<a class="delete-item" href="/item/delete/154">DELETE</a>
<a class="delete-item" href="/item/delete/155">DELETE</a>
<a class="delete-item" href="/item/delete/156">DELETE</a>

JAVASCRIPT

<script>
    $(".delete-item").on('click', function (event) {

        event.preventDefault();

        var x = confirm("Do you want to delete this item?");
        if (x) {
            window.location = this.href;
        }
        else {
            return false;
        }

    });
</script>

我工作，但只有我只有一个项目delete-item。

每当我有一个来自foreach循环的列表时，我有大约20个这个类的项目，如果我不想删除该项而不是一次，我必须将其解雇20次。例如，如果我点击第15项的删除按钮，我必须在第2次时将其解雇5次然后18次等。

出于某种原因，它并没有停止点击的项目，而是遍历所有其他项目。

我的代码中有错误吗？如何让它只为点击的项目运行一次？