How to solve remove data from local storage? please help me [closed]

when i tried to display input value in UI and input data from local storage, it shows two warnings

1. Uncaught TypeError: Cannot read properties of null (reading 'forEach').
2. Uncaught ReferenceError: handleClearAll is not defined;

Would you please help me to solve this problems?

// common fucntion
const getElement = (id) => {
  const elementText = document.getElementById(id);
  return elementText;
};
const handleClick = () => {
  const inputText = getElement("todo-text").value;

  const todos = JSON.parse(localStorage.getItem("TODOS"));

  if (!todos) {
    const todoList = [
      {
        title: inputText,
        completed: false,
      },
    ];
    // set to local storage
    localStorage.setItem("TODOS", JSON.stringify(todoList));
  } else {
    const todoList = [
      ...todos,
      {
        title: inputText,
        completed: false,
      },
    ];
    // set to local storage
    localStorage.setItem("TODOS", JSON.stringify(todoList));
  }
  render();
};

// show on UI

const render = () => {
  const todo = JSON.parse(localStorage.getItem("TODOS"));
  const ul = getElement("todo-list");
  ul.innerHTML = "";
  todo.forEach((item) => {
    const li = document.createElement("li");
    li.classList.add("py-2");
    li.innerText = item.title;
    ul.appendChild(li);
  });
};

render();

const handleClearAll = () => {
  localStorage.removeItem("TODOS");
  render();
};

Via Active questions tagged javascript - Stack Overflow https://ift.tt/ljndhT6