text: const form = document.getElementById("form");
  const input = document.getElementById("input");
  const todosUL = document.getElementById("todos");                   //starting the js 
  
  const todos = JSON.parse(localStorage.getItem("todos"));
  
  if (todos) {
      todos.forEach((todo) => {
          addTodo(todo);
      });
  }
  
  form.addEventListener("submit", (e) => {     //submit option will be visible
      e.preventDefault();
  
      addTodo();
  });
  
  function addTodo(todo) {
      let todoText = input.value;
  
      if (todo) {
          todoText = todo.text;
      }
  
      if (todoText) {
          const todoEl = document.createElement("li");
          if (todo && todo.completed) {
              todoEl.classList.add("completed");
          }
  
          todoEl.innerText = todoText;
  
          todoEl.addEventListener("click", () => {
              todoEl.classList.toggle("completed");                 //Setting right and left clicking responses
  
              updateLS();
          });
  
          todoEl.addEventListener("contextmenu", (e) => {
              e.preventDefault();
  
              todoEl.remove();
  
              updateLS();
          });
  
          todosUL.appendChild(todoEl);
  
          input.value = "";
  
          updateLS();
      }
  }
                                                                    //to save the todo list....
  function updateLS() {
      const todosEl = document.querySelectorAll("li");
  
      const todos = [];
  
      todosEl.forEach((todoEl) => {
          todos.push({
              text: todoEl.innerText,
              completed: todoEl.classList.contains("completed"),
          });
      });
  
      localStorage.setItem("todos", JSON.stringify(todos));
  }
  