Estoy varado en un código. El código consiste en agregar elementos a una lista y después borrar cada elemento ' li ' con solo un click en el mismo. ¿En que estoy fallando? Por ejemplo agrego tres elementos a mi lista, y yo quiero borrar el segundo elemento pero se me borra el primer elemento, quiero borrar el tercer elemento pero se borra el segundo elemento de la lista. Me he puesto a pensar que no estoy usando bien el siclo for(){}. Aparte de esto en la consola me aparece error.
/*variables*/
let inpText=document.getElementsByName("inp")[0];
let btn=document.getElementsByName("inp")[1];
btn.setAttribute("value","add");
let padre=document.getElementById("lista");
let hija=padre.children;
/*funciones*/
Limpiar = () => inpText.value="";
Agregar= () => {
let x = document.createElement("li");
x.textContent=inpText.value;
padre.appendChild(x);
}
Eliminar = () => {
for(let i=0;i<hija.length;i--){
padre.removeChild(hija[i]);
}
}
/*eventos*/
inpText.addEventListener("click",Limpiar);
btn.addEventListener("click",Agregar);
padre.addEventListener("click",Eliminar);
<input type="text" name="inp" placeholder="agregar items">
<input type="button" name="inp">
<ul id="lista">
</ul>