To-do list. I have dynamic added checkboxes and styles for them in css. I wanna save checked checkboxes styles after refreshing the page using local storage. I've tried everything but nothing works. Any ideas? Thank you. (Also checkboxes are already in the local storage) Here's full code https://github.com/cyber8nav/To-do-list

function addTask(nameOfTheNewTask) {
let task = {
    id: Date.now(),
    name: nameOfTheNewTask,
    completed: false
};

tasks.push(task);
textArea.value = "";
addTaskWindow.style.display = "none";
tasksWindow.style.display = "block";
if (tasks.length == 1) {
    amount.textContent = tasks.length + " " + "Task";
} else {
    amount.textContent = tasks.length + " " + "Tasks";
}
renderTask(tasks);
addToStorage(tasks);}
function renderTask(tasks) {
list.innerHTML = "";
tasks.forEach((item) => {
    const newTask = document.createElement("li");
    newTask.setAttribute("data-key", item.id);
    newTask.innerHTML = `
    <label class = "tasks__item">
        <input type = "checkbox" class = "checkbox" name = "task">
        <span>${item.name}</span>
    </label>
    <img class="delete" src="img/icons/delete.svg" alt="del" width="18px" height="20px">`;
    list.append(newTask);
});}
 // checkbox    
    &::before{
        content: '';
        display: inline-block;
        width: 1.2em;
        height: 1.2em;
        border-radius: 50%;
        border: 2px solid $darkgrey;
        position: absolute;
        left: 0;
        top: 0;
    }
}
// checked checkbox
input[type=checkbox] + span::after{
    content: '';
    opacity: 0;
    transition: opacity 0.6s ease;
}

input[type=checkbox]:checked + span::after{
    content: '✓';
    color: $blue;
    font-weight: 900;
    position: absolute;
    left: 0.225rem;
    top: -0.025rem;
    opacity: 1;
}
input[type=checkbox]:checked + span{
    color: $grey;
    text-decoration: line-through;
    animation: strike 1s linear;
    transition: color 0.6s ease-out;
}
input[type=checkbox]:checked + span::before {
    border: 2px solid $blue;
    transition: color 1s ease-out;
}

}