Neil McPartlin14,636 Points
Using localStorage: Best way forward?
The objective would be to save to localStorage, the complete const 'ul' (document.getElementById('invitedList')), then use this to rebuild 'ul' when restarting the app.
The tricky part though is that localStorage can only store strings, so arrays and objects need to be converted. I have tried with JSON.stringify to make the necessary conversion but no joy so far. I suspect some preliminary conversions need to be done first. I'm conscious that the above would also contain buttons and checkboxes which may be regarded as overkill and wasteful of the available storage space.
It could be a different approach is required. Instead I should just look to create and save a JSON.stringified object made up of pairs of data e.g. 'name' : 'status', (e.g. ['mary' : 'confirm' , 'john' : ' confirmed'] then use this data to repopulate a new empty 'ul'.
I did watch the localStorage workshop, but only simple strings were being stored and retrieved. I'm not looking for a final solution right now, just a recommendation on the best approach.
Steven Parker173,644 Points
You'll notice that the console.log call that is inside the code will show the same thing that is placed in local storage, but the one you run by hand shows more. That's happening because you're updating the local storage in the "createLI" function that creates a new list item. If you want the new item to be included in the storage, you should move the setItem call out of that function and place it in the submit event handler, after the call to appendChild where the new list item is added to the ul.