慕慕遇到的问题：发现新添加的列表项没有点击移除的功能，需要使用什么方法才能完成。

本节题目中出现这个问题是因为使用了querySelector是静态获取元素，而不是使用getElementById去动态获取元素么？为什么下面的代码无法得到预期结果。

<input type="text" class="textInput">
    <button id="btn">添加</button>
    <ul id="list">
        <li >吃饭</li>
        <li >睡觉</li>
        <li >打豆豆</li>
    </ul>
    <script>
        // 获取元素
        var textInput = document.querySelector(".textInput")
        var btn = document.querySelector("#btn")
        var list = document.getElementById("list")
        
        // 给按钮绑定点击事件
        btn.onclick = function () {
            var ol = document.createElement("li")
            ol.innerHTML = textInput.value;
            list.appendChild(li)
            textInput.value = ""
        }
        // 给li绑定点击事件
        for (var i = 0; i < li.length; i++) {
            li[i].onclick = function (e) {
                ol.removeChild(e.target)
            }
        }

    </script>