Local Storage not storing created lists

Question

So I am trying to get my local storage that stores the created tasks when the browser refreshes, granted there could be multiple tasks created, so I am not sure if it needs to be in a forEach loop or if my storage local function is missing something

Is there something I might be missing as to how my local storage might be done incorrectly? The outcome should be that if a task/s have been created it saves on browser refresh

/**********************************************
 * function that creates the HTML elements    *
 **********************************************/

 const createTask = () => {
    const id = createId()
    const task = elements.input.value;
    const date = elements.cal.value;

    if(!task && !date) return alert("Please fill in task and select date");
    if(!task) return alert("Please fill in task");
    if(!date) return alert("Please select date");

    const tasks = document.createElement("div");

    tasks.innerHTML = `
    <button class = "sort">Sort</button>
    <div class="task" data-id = "${id}">
        <div class="content">
            <input type ="checkbox" class="tick">
            <input type ="text" class = "text" id = "text" value="${task}" readonly>
            <label class = "due-date" for ="text">${date}</label>
            <input type ="date" class = "date" id = "date">
        </div>

        <div class = "actions">
            <button class="edit" data-id="${id}">Edit</button>
            <button class="delete" data-id="${id}">Delete</button>
        </div>
    </div>
    `
    elements.list.appendChild(tasks)
    markOfdddueDate()
    
    return tasks
}

/**************************************************************
 * Event that listens for the edit,save and delete buttons    *
 **************************************************************/
elements.list.addEventListener('click',event => {
    const {target} = event;
    const {id} = target.dataset;
    const task = id ? document.querySelector(`[data-id="${id}"]`):null;  

    const type = {
        edit: event.target.classList.contains('edit'),
        delete: event.target.classList.contains('delete')
    }

    const isFromSaveLabel = target.innerText.toLowerCase() === 'save'

    //Checking to see if buttons are pressed//

    if(task && type.edit && isFromSaveLabel){
        const text = task.querySelector('.text')
        target.innerText = 'Edit'
        text.setAttribute('readonly', "true")
        return
    };

    if(task && type.edit){
        const text = task.querySelector('.text')
        target.innerText = 'save'
        text.removeAttribute('readonly')
        text.focus()
        return
    };

    if(task && type.delete){
        const textlist = task.querySelector('.task')
        textlist.appendChild.remove()
        return
    }
    
});

function getStoredtask(){
    const storedkey = localStorage.getItem(STORAGE_KEY);
    if(storedkey){
      task = JSON.parse(storedkey);
      createTask()
    }
  }

 function Storingtasks(){
    localStorage.setItem(STORAGE_KEY, JSON.stringify(createTask()))
 }

 getStoredtask()