How to delete a user inputted object JS

Question

I am working on a project where a user can add their favorite music, they should be able to edit and delete their options too. I can only use vanilla JS and I need to use sessionStorage for this project. I am struggling with the delete and edit capabilities. Below is the code I have, any pointers please.

Below I am creating new table body elements for everything that the user inputs

music.forEach(function (m) {
  let tableItem = document.createElement("tbody");
  tableItem.innerHTML = `<td>${m.artistName}</td> <td>${m.songName}</td> <td>${m.albumName}</td> <td>${m.genreType}</td> <button id="deleteBtn" onclick="deleteMusic()">Delete Entry</button><button id="editBtn" onclick="editMusic()">Edit Entry</button>`;
  tableItem.value = i;
  i = i + 1;
  htmlTable.appendChild(tableItem);
});

and below I'm trying to invoke the below function with the button that I create dynamically above in the table

  music = JSON.parse(sessionStorage.getItem("favMusic"));
  sessionStorage.removeItem("favMusic", JSON.stringify(music));
}

If it will help I can post my whole script if necessary

I am storing the data on sessionStorage using JSON. I am trying to allow the user to delete one of their created objects. So a user can input the artist name, song and album name as well as the genre. But I want the user to be able to click a button (the buttons are dynamically created in JS to display in the table as well) and allow them to delete or edit a certain entry in the DOM