Lucho con el problema de borrar el campo de entrada de texto cuando se agrega una nueva línea al hacer clic en el botón. Cuando agrego un número al campo de entrada y hago clic en el botón +, quiero que el número agregado en la primera línea permanezca en el campo de entrada, pero en su lugar se borra. La solución es quizás muy fácil, pero como estoy aprendiendo javascript en este momento, no puedo encontrar la razón por la cual el campo eliminó mis entradas. Aquí está mi código:

 function Item(data) { Object.assign(this, data) this.getItemHtml = function () { const {itemNo, quantity} = this; return ` <ul class="grid list-item"> <li class="col-1">${this.itemNo++}</li> <li class="col-2"><input type="number" id="item-qty${itemNo}" required></li> </ul> `; }} const itemNo = new Item(iItem.itemData) function render() { document.getElementById("i-list").innerHTML += itemNo.getItemHtml() } function addItem() { render() getInput() updateHtmlValue() } document.getElementById("add-item").addEventListener("click", addItem) function getInput() { var el = document.querySelector("ul li:nth-child(2) input") if (el) { el.addEventListener("change", function (event) { let inputValue = event.target.value; if (inputValue < 0) { inputValue = 0 } localStorage.setItem("inputValue", inputValue) }) } } function updateHtmlValue() { var input = localStorage.getItem("inputValue") }