Pasa el mensaje!

Queremos que, al hacer clic en el botón "Enviar", el texto que hayamos introducido en el input sea escrito debajo de Last Message Delivered

Pasos a seguir

1. Intenta primero simplemente recuperar el elemento del DOM al que debes aplicar el evento click
2. Comprueba que eres capaz de aplicarlo, haciendo una prueba simple, como por ejemplo, que al hacer clic, muestre un mensaje por la consola.
3. Después, haz que al hacer clic en el botón, intenta escribir alguna cosa debajo de Last Message Delivered. Cualquier texto.
4. Investiga un poco sobre como conseguir el valor de un campo input.
5. Usa la información del punto anterior para conseguir el valor del campo input, y escríbelo en el elemento del DOM adecuado.
6. BONUS. Fíjate en la demo como se comporta la aplicación cuando no existe un mensaje en el input y le damos a Enviar. ¿Serías capaz de emular dicho comportamiento?

Finalmente, en js/solution_provided.js tienes una solución del autor original.

Restricciones

1. NO copies/pegues una línea de código. Ni siquiera de tu ejercicio anterior. El objetivo es que obtengas soltura y entendimiento en los datos que estás tratando.

2. Queda prohibido el uso de cualquier otro método para obtener elementos del DOM que no sea querySelector.

Demo del proyecto

Demo