如何获得在列表项旁边显示的按钮?

我正在用Javascript做一个基本的待办事项清单应用程序。我可以输入列表元素,但是我无法在列表元素旁边放置“删除”按钮,也无法通过该按钮删除列表中的项目。

function todoList() {
  var item = document.getElementById("todoInput").value
  var text = document.createTextNode(item)
  var newItem = document.createElement("li")
  newItem.appendChild(text)
  document.getElementById("todoList").appendChild(newItem)

  var remove = document.createElement('button');
  remove.classList.add('remove');
  remove.innerHTML = "X";
  remove.addEventListener('click', () => this.remove(todoInput));

}
<form id="todoForm">
  <label>Task Name: </label>
  <input id="todoInput">
  <button type="button" onclick="todoList()">Add Task</button>
</form>
<ol id="todoList">
</ol>