Javascript动态创建的事件处理程序一旦添加另一个就消失了

Question

我有一个有序列表，我想让点击时消失的项目。

我有以下javascript代码：

<script>
    let halls = new Set();

    function rm() {
        halls.delete((this.id).substring(0,this.id.length-4));
        document.getElementById(this.id).remove();
    }
    function setEventHandler(obj, name, fn) {
        if (typeof obj == "string") {
            obj = document.getElementById(obj);
        }
        if (obj.addEventListener) {
            return(obj.addEventListener(name, fn));
        } else if (obj.attachEvent) {
            return(obj.attachEvent("on" + name, function() {return(fn.call(obj));}));
        }
    }

    function addHall() {
        let oldSize = halls.size;
        let chosen = document.getElementById("hall2").value;
        halls.add(chosen);
        if (oldSize != halls.size) {
            document.getElementById("fillHall").innerHTML += `<li id="${chosen}List" name="${chosen}" >${chosen}</li>`;
            setEventHandler(chosen + "List", "click", rm);
        }
    };

    document.getElementById("hall2").onchange = addHall;
</script>

我有什么问题吗？如何保留将删除列表项的事件处理程序？

我知道我的代码很草率：/抱歉

由于