hola como les va? bueno mi problema es que la funcion boton deberia guardar informacion a travez del array y a medida que se vaya agregando nuevos valores irlos mostrando uno a uno al listado. esto se que puedo hacerlo con un ciclo for, pero entiendo que tambien se puede con for of. ahora bien, el array solo muestra un valor, si quiero agregar dos valores me reemplaza el anterior, intento darle vueltas pero no se que esta sucediendo
function boton(){
let cajita = [];
let txtTarea = document.getElementById('txtTarea');
let tareas = txtTarea.value;
cajita.push(tareas);
let listado = document.getElementById ('listado')
let txt= ' '
for (let allTareas of cajita){
listado.innerHTML = txt+=allTareas+ '<br>'
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<label> Tareas: </label>
<input type="text" id="txtTarea" name="tarea" placeholder="ingrese su tarea"/>
<button id="btnAgregar" onclick="boton()"" type="submit">Agregar</button>
</form>
<div id="listado"></div>
<script src="listado.js"></script>
</body>
</html>