i was trying to add localStorage on my to-do list, but it just returns me 'undefined' and off the <'li'> that <'li'> is created when you input a value. I've already tried to use the id="myList" inside a <'li'> but it didn't worked

            <form>
                <input type="text" nome="task" id='task' placeholder="New..." />
                <input type="button" nome="" value='AddTask' onclick="addTask()" />
            </form>

                <ul id="myList">
                </ul>

<script type="text/javascript">
    var ul = document.getElementById("myList");

    addTask = function() {
        if (document.getElementById("task").value != ""){
            let item = document.getElementById("task");
            let itemId = Date.now().toString('16') + Math.random().toString('16').substring(2);
            ul.innerHTML += `<li id=${itemId}>${item.value}<button onclick="removeTask('${itemId}')">X</button></li>`
            
            saveLocalStorage()
        }
    }

    removeTask = function (itemId) {
        document.getElementById(itemId).remove()
        saveLocalStorage()
    }

    saveLocalStorage = function() {
        localStorage.setItem('savedList', ul.InnerHTML)
        
    }

    window.onload = function() {
        ul.innerHTML=localStorage.getItem('savedList')
    }