если id не нужен
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<ul class="todos"></ul>
<input type="text" class="todotext">
<button class="addtodo">add todo</button>
<script>
let todos = [];
const todosEl = document.querySelector('.todos');
const todoTextEl = document.querySelector('.todotext');
const update = () => {
todosEl.innerHTML = todos.map((todo,i)=> `<li>${i + 1} - ${todo.text} <button data-todo-id=${i}>x</button></li>`).join('')
}
document.querySelector('.addtodo').addEventListener('click', () => {
todos.push({
text: todoTextEl.value
})
todoTextEl.value = ''
update()
})
todosEl.addEventListener('click', ({target}) => {
target = target.closest('[data-todo-id]');
if(target){
todos.splice(target.dataset.todoId, 1);
update()
}
})
</script>
</body>
</html>