script.js

const inputbox = document.querySelector('.input-box');
const listcontainer = document.querySelector('.list-container');
// save data
function addTask() {
    if (inputbox.value === '') {
        alert('You must write something!');
    } else {
        let li = document.createElement('li');
        li.innerHTML = inputbox.value;
        listcontainer.appendChild(li);
        let span = document.createElement('span');
        span.innerHTML = '\u00d7';
        li.appendChild(span);
    }
    inputbox.value = '';
    saveData();
    
}
// delete task
listcontainer.addEventListener('click', function(e) {
    if (e.target.tagName === 'LI') {
        e.target.classList.toggle('checked');
        saveData();
    } else if (e.target.tagName === 'SPAN') {
        e.target.parentElement.remove();
        saveData();
    }
}, false);

// add task
inputbox.addEventListener('keypress', function(e) {
    if (e.key === 'Enter') {
        addTask();
    }
});
// save task
function saveData() {
    localStorage.setItem('data', listcontainer.innerHTML);
}
// showtask
function showTask() {
    listcontainer.innerHTML = localStorage.getItem('data');
}
showTask();