ejemplos/clase8/index.html

<!DOCTYPE html>
<html lang="es">
<head>

  <title>Ejemplo eventos</title>
  <meta charset="UTF-8" />
</head>

<body>

    <button id="miBoton">Añade item</button>
    <ul id="miLista">

    </ul>

    <script>
        window.addEventListener('DOMContentLoaded', function() {
            let contador = 1;
            const boton = document.getElementById('miBoton')
            const lista = document.getElementById('miLista')
            boton.addEventListener('click', function() {
                const nuevoLi = document.createElement('li');
                const contenido = document.createTextNode(`Item ${contador}`);
                nuevoLi.append(contenido)

                setTimeout(function() {
                    lista.append(nuevoLi)
                }, 1500)
                contador += 1;
            })
        })
    </script>
</body>

</html>