Doesn't save in Local Storage

const form = document.getElementById('registrar');
const input = form.firstElementChild;
const ul = document.getElementById('invitedList');
const lis = ul.children;
const myStorage = window.localStorage;

const mainDiv = document.querySelector('.main');
const newDiv = document.createElement('div');
const filterLabel = document.createElement('label');
const filterCheckbox = document.createElement('input');

const clearUl = document.getElementById('clearStorage');
const clearLi = document.createElement('li');
clearUl.appendChild(clearLi);
const clearButton = document.createElement('button');
clearButton.textContent = 'Clear Storage';
clearLi.appendChild(clearButton);

filterLabel.textContent = 'People who haven not responded';
filterCheckbox.type = 'checkbox';
newDiv.appendChild(filterLabel);
newDiv.appendChild(filterCheckbox);
mainDiv.insertBefore(newDiv, ul);


filterCheckbox.addEventListener('change', (e) => {
  const isChecked = e.target.checked;
  if(isChecked) {
      for(let i = 0; i < lis.length; i++) {
        if(lis[i].className === 'responded') {
          const respondedLabel = lis[i].childNodes[1];
          lis[i].style.display = '';
          respondedLabel.style.display = 'none';
        } else {
          lis[i].style.display = 'none';
        }
      }
  } else {
    for(let i = 0; i < lis.length; i++) {
      const respondedLabel = lis[i].childNodes[1];
      lis[i].style.display = '';
      respondedLabel.style.display = '';
    }
  }
});

function createLi (text) {

  function createElement (elementName, property, value) {
    const element = document.createElement(elementName);
    element[property] = value;
    return element;
  }

  function appendLi(elementName, property, value) {
    const element = createElement(elementName, property, value);
    li.appendChild(element);
    return element;
  }

  const li = document.createElement('li');
  const p = document.createElement('p');

  appendLi('span', 'textContent', text);
  appendLi('label', 'textContent', 'Not Confirmed')
    .appendChild(appendLi('input', 'type', 'checkbox'));
  appendLi('button', 'textContent', 'Edit');
  appendLi('button', 'textContent', 'Remove');
  return li;
}

form.addEventListener ('submit', (e) => {
  e.preventDefault();
  //allocate the invitees in a new variable
  const pastInvitees = getInvitees();
  const text = input.value;
  if(text === ''){
    alert('There is no name');
  }
  input.value = '';
  const li = createLi(text);
  ul.appendChild(li);
});




ul.addEventListener ('change', (e) => {
  const checkbox = e.target;
  const checked = checkbox.checked;
  const listItems = checkbox.parentNode.parentNode;
  confirmLabel = checkbox.parentNode.firstChild;
  if(checked) {
    listItems.className = 'responded';
    confirmLabel.textContent = 'Confirmed';
  } else {
    listItems.className = '';
    confirmLabel.textContent = 'Not Confirmed';
  }
});

ul.addEventListener ('click', (e) => {
  if(e.target.tagName == 'BUTTON') {
    const button = e.target;
    const li = e.target.parentNode;
    const action = button.textContent.toLowerCase();

    const nameAction = {
      remove: () => {
        ul.removeChild(li);
      },
      edit: () => {
        const span = li.firstElementChild;
        const input = document.createElement('input');
        input.type = 'text';
        input.value = span.textContent;
        li.insertBefore(input,span);
        li.removeChild(span);
        button.textContent = 'Save';
      },
      save: () => {
        const newSpan = document.createElement('span');
        const input = li.firstElementChild;
        const span = document.createElement('span');
        span.textContent = input.value;
        li.insertBefore(span, input);
        li.removeChild(input);
      }
    };

    nameAction[action]();
  }  
});

clearButton.addEventListener('click', () => {
  removeInvitees();
});

///////////////////LOCAL STORAGE

function supportsLocalStorage() {
  console.log('supports');
  return ('localStorage' in window) && (window['localStorage'] !== null);

}

function getInvitees() {
  console.log('gets');
  const invitees = localStorage.getItem('invitees');
  if(invitees) {
    return JSON.parse(invitees);
  } else {
    return [];
  }
}

function saveInvitees(str) {
  const invitees = getInvitees();
  invitees.push(str);
  localStorage.setItem('invitees', JSON.stringify(invitees));
  console.log('adds');
}

function removeInvitees(str) {
    const registrants = getInvitees()
    const toBeRemovedIdx = registrants.indexOf(str)

    registrants.splice(toBeRemovedIdx,1)
    localStorage.setItem('registrants', JSON.stringify(registrants))
    console.log('remove')
}

window.onload = function () { 
  if(supportsLocalStorage) {
    //remove the invitees
    const pastInvitees = getInvitees();
    input.value = '';
    //add invitees to the local storage
    for(i = 0; i < pastInvitees.length; i++){
      const newLi = createLi(pastInvitees[i]);
      ul.appendChild(newLi);
    }
  }
  console.log('works');  
}