Solucionado (ver solución)
Solucionado
(ver solución)
2
respuestas

Code to add an item to the Unordered list preventing the default execution in browser.

I think this is the code needed in the section commented by "Jessica", I mean the part in the comment "Código para adicionar en la lista de Actividades"

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

<head>
    <meta charset="UTF-8">
    <title>Appending a Li to an Ul</title>
</head>

<body>
    <ul class="Actividades">
        <li>Ir al médico</li>
        <li>Cambiar la contraseña del Wi Fi</li>
        <li>Estudiar Javascript</li>
    </ul>
    <form class="adicionar-tarea">
        <input type="text" name="tarea">
        <button id="boton-adicionar">Guardar</button>
    </form>
</body>
<script>
    var form = document.querySelector('.adicionar-tarea');
    var boton = document.querySelector('#boton-adicionar');
    boton.addEventListener("click", function (event) {
        event.preventDefault()
        console.log(form.tarea.value);
        var ul = document.querySelector(".Actividades");
        var li = document.createElement("li");
        li.appendChild(document.createTextNode("New Item in Unordered list"));
        ul.appendChild(li);
    });
</script>

</html>
2 respuestas
solución!

Yeah, this should be working for sure.

Hi Gustavo,

I copied and run your code and it works perfect, the onlye change for add the correct value of text box to the list, is next code line:

li.appendChild(document.createTextNode(form.tarea.value));

I really apreciate your contribution for us.

Regards