如何從列表中刪除添加的項目？

Question

我正在嘗試學習 JS，我決定制作一個真正的應用程序，這樣我就可以在做一些事情的同時學習。 我正在嘗試制作一個待辦事項列表應用程序，我添加了項目，但我無法弄清楚如何在點擊項目時刪除項目。

這是代碼本身：

我的待辦事項

    <input id= "input" class="form-control" placeholder="Add items to your TODO list." type="text">

    <button id="button" class="button btn btn-primary btn-block">Add</button>

    <div class="items">
        <ul id= "listGroup" class="list-group">
        </ul>
    </div> <!-- JS Items !-->
</div> <!-- End Div -->

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
<script src="app.js"></script>

JS：

var button1 = document.getElementById("button")

button1.addEventListener("click", addItem)

function addItem() {

    let item = document.getElementById("input").value
    let add = document.getElementById("listGroup")

    let makeLi = document.createElement("li")
    let makeText = document.createTextNode(item)
    makeLi.className += "list-group-item"

    let icon = document.createElement("i")
    icon.className += "fa fa-times"

    add.appendChild(makeLi).appendChild(makeText)
}

function revomeItem() {
}

Answer 1

makeLi.onclick = function(){
 this.remove();
};

Answer 2

var div1 = document.getElementById("div-01")
    div1.addEventListener("click", removeItem);
    function removeItem(e){
        e.target.remove();
    }

這應該工作..