Как исправить мой To Do List на js?

Question

[zeletti]

Делаю свою тудушку, вначале подсматривал на ютубе, потом делал уже самостоятельно функционал.
Вот код: https://jsfiddle.net/nxuh5kdv/
И такая проблемка возникла, последний элемент списка не удаляется со страницы, хотя удаляется из массива в локал сторадж. Думаю тут есть очевиднейший ответ, но я его найти не могу.
И не стесняйтесь обругать мой г*внокод.

Answer 1

[0xD34F]

let displayMessage = '';
doItems.forEach((item, i) => {
    displayMessage += `
    <li class="do__item">
        <input type="checkbox" id="do_${i}" ${item.checked ? 'checked': ' '}>
        <label for="do_${i}" class="${item.checked ? 'checked' : ' '}">${item.message}</label>
        <button class="remove" id="do_${i}">Delete</button>
    </li>`;
    block.innerHTML = displayMessage;
});

Установка значения block.innerHTML должна производиться после forEach'а, а не внутри.

UPD. Кстати, а какого хрена у вас элементы с одинаковыми id (input и button)?

Answer 2

[acwartz]

Вы забываете удалить блок задачи из html.
допишите чтобы блок задачи тоже содержал идентификатор do_{i}, чтобы его можно было найти и удалить.