I need advice. I have a table, I store items in it, which are stored in localStorage and then inserted into the table. I need to set the delete button in the list. In order for it to work, when I click on it, the given row is deleted from both localStorage and the table.

let form = document.querySelector("#form-list")


if(localStorage.getItem("task") == null){
    var taskArray = []
} else {
    taskArray = JSON.parse(localStorage.getItem("task"))
}

form.addEventListener("submit", function(event){
    // event.preventDefault()
    
    taskArray.push({
        id: uuidv4(),
        job: event.target.elements.selected.value,
        task: event.target.elements.text.value
    })
        
        // Clear the input and select boxes
        event.target.elements.selected.value = ""
        event.target.elements.text.value = ""

        // save localStorage
        taskArrayJSON = JSON.stringify(taskArray)
        localStorage.setItem("task", taskArrayJSON)

})

const buildTable = function(){
    let table = document.getElementById("table")

    for(let i = 0; i < taskArray.length; i++){
        var row = `<tr>
                    <td>${taskArray[i].job}</td>
                    <td>${taskArray[i].task}</td>
                    <td><button class="btn btn-primary" onclick="deleteButton(this)">Delete</button></td>
                  </tr>`
        table.innerHTML += row
    }
}

buildTable(taskArray)

const deleteButton = function(row){
    let table = JSON.parse(localStorage.getItem("task"))
    localStorage.removeItem("id")
    table.splice(row, 1)
    localStorage.setItem("task", JSON.stringify(table)) 
    



}
//Podle ID najdeme index daného jména a pomocí splice ho odstraníme
const removeTask = function(id){
    const index = taskArray.filter(function(nameTask){
        return nameTask.id === id
    })

    if(index > -1){
        taskArray.splice(index,1)
    }
}