Método append
El método append agrega texto al final
del elemento. También existe el método
appendTo,
que funciona de manera similar.
Sintaxis
Insertar texto al final del elemento:
$(selector).append(texto);
Al final de los elementos seleccionados se puede agregar texto, que será devuelto por una función personalizada. La función se llama, por separado para cada uno de los elementos seleccionados. Al llamarla se le pasan los siguientes parámetros: posición del elemento en el conjunto, contenido actual del elemento:
$(selector).append(function(número en el conjunto, contenido actual del elemento));
El contenido también puede ser no solo texto normal, sino también un elemento DOM o un objeto jQuery. En este caso, estos elementos se moverán desde su posición en el código HTML.
Ejemplo
Insertemos texto al final del párrafo dado:
<p id="test">texto</p>
$('#test').append('!!!');
El código HTML quedará así:
<p id="test">texto!!!</p>
Ejemplo
Insertemos texto con etiquetas al final del párrafo dado:
<p id="test">texto</p>
$('#test').append('<b>!!!</b>');
El código HTML quedará así:
<p id="test">texto<b>!!!</b></p>
Ejemplo
Encontremos todos los párrafos y al final de cada uno de ellos pongamos su número de orden en el conjunto:
<p>texto</p>
<p>texto</p>
<p>texto</p>
<p>texto</p>
<p>texto</p>
$('p').append(function(index, text){return index;});
El código HTML quedará así:
<p>texto0</p>
<p>texto1</p>
<p>texto2</p>
<p>texto3</p>
<p>texto4</p>
