Please help with personal project - replace object values with user input values

Here is a JSFiddle of the project - https://jsfiddle.net/h85w21ua/4/

Basically this project is a contact diary app where you can view, create, edit and or delete contacts.

When you create a new contact, that contact is pushed into the an array as a object and then stored into local storage.

create button to create a new contact > Show all to view all contacts > and then edit to make changes to the contact >then save button to save those changes.

the save function is NOT working accordingly… when you click save, it should take the changes made and replace the values of the object… and then it should update the local storage.

So what needs to happen here is that the object values need to be replaced by the values of the text input(changes made by user) when the save button is clicked.

Below is the code for the Save Function of the app.

Please help… thank you.

//Function for Save button.
save = () => {
  for (var i = 0; i < contactsBook.length; i++) {
    if (contactsBook[i].firstName === ul.getAttribute('data-person')) {
      for (var k = 0; k < ulChild.length; k++) {
        if (ulChild[k].tagName === "LI") {
          const editedItems = ulChild[k];
          const inputs = editedItems.firstElementChild;
          const createItem = document.createElement("LI");
          createItem.textContent = inputs.value;
          editedItems.insertBefore(createItem, ulChild.childNodes);
          inputs.parentNode.removeChild(inputs);
          button.textContent = "Edit";
        };
      };
    };
  };
};

Hi @Darsh2987

You need to persist the changed object back to local storage when you save it, as you have done with add and remove.