Añadir contenido con jQuery: Funciones append y prepend

Este post explicará como añadir contenido después del último hijo del elemento seleccionado y al principio del elemento. Para ello se usarán las funciones append y prepend respectivamente.

Función .append()

Esta función añade HTML justo después del último hijo de un elemento elemento seleccionado. Por ejemplo, tienes un elemento div y quieres añadir contenido justo antes de su cierre de etiqueta. También, la función .append() es una buena manera de añadir un elemento al final de una lista ya sea ordenada o desordenada.

Para mostrar su uso usaré el ejemplo de los errores que he ido utilizando en previos posts de esta serie.

Al escribir este código en la etiqueta <script>

El código final ha debido de quedar así.

El nuevo párrafo aparece justo después del último del div errores.

Función .prepend()

Es como la función .append() solo que añade el HTML directamente después de la apertura de la etiqueta del elemento seleccionado. Basándonos en el ejemplo anterior, se podría añadir un error al inicio del div errores.

El resultado final del código sería el siguiente

Como puedes observar, ahora el error está justo después de la apertura del div errores.

Y hasta aquí el uso de las funciones append y prepend, espero que os haya gustado. A seguir picando 🙂