Método after
O método after adiciona texto após
o elemento especificado. Também existe o método
insertAfter,
que funciona de maneira semelhante.
Sintaxe
Inserindo texto após o elemento:
$(seletor).after(texto);
Desta forma, após os elementos selecionados será adicionado o texto que será retornado pela função personalizada. A função é chamada separadamente para cada um dos elementos selecionados. No primeiro parâmetro desta função é passado o índice na coleção de cada um dos elementos selecionados (por vez), no segundo - o conteúdo atual do elemento:
$(seletor).after(function(índice na coleção, conteúdo atual do elemento));
O texto também pode não ser apenas texto comum, mas também um elemento DOM ou um objeto jQuery. Neste caso, esses elementos serão movidos de sua posição no código HTML.
Exemplo
Vamos inserir texto após o parágrafo especificado:
<p id="test">text</p>
$('#test').after('!!!');
O código HTML ficará assim:
<p id="test">text</p>!!!
Exemplo
Vamos inserir texto com tags após o parágrafo especificado:
<p id="test">text</p>
$('#test').after('<p>!!!</p>');
O código HTML ficará assim:
<p id="test">text</p><p>!!!</p>
Exemplo
Vamos mover um parágrafo para abaixo do outro (ou seja, recortar o parágrafo do local antigo e colocar no novo):
<p id="p1">text1</p>
<p id="p2">text2</p>
$('#p1').after($('#p2'));
O código HTML ficará assim:
<p id="p1">text1</p>
<p id="p2">text2</p>
Veja também
-
método
insertAfter,
que adiciona texto após o elemento especificado -
métodos
before,append,prepend,
permitindo adicionar conteúdo em um determinado local na página -
método
clone,
que cria cópias dos elementos selecionados