appendTo()

посл. ред. 12.08.2016

Метод appendTo() добавляет элементы, представленные текущим jQuery-объектом, в конец каждого элемента, указанного аргументом (перед закрывающим тегом).

Варианты использования

jQ_object.appendTo(селектор) => jQuery: Добавляет/перемещает элементы текущей выборки в конец каждого элемента, удовлетворяющего указанному селектору.
jQ_object.appendTo(DOM-элемент) => jQuery: Добавляет/перемещает элементы текущей выборки в конец указанного DOM-элемента.
jQ_object.appendTo(jQuery-объект) => jQuery: Добавляет/перемещает элементы текущей выборки в конец каждого элемента, представленного jQuery-объектом.

Примеры

<html>
<head>
  <title>Работа с элементами DOM</title>
  <script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
  <p>Параграф 1</p>
  <p>Параграф 2</p>
</body>
</html>
 
<script>
$('<br><span>Автор: </span>')
  .appendTo('p');
/* добавление каждому параграфу HTML-кода */
</script>

Параграф 1
Автор:

Параграф 2
Автор:

<html>
<head>
  <title>Работа с элементами DOM</title>
  <script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
  <p class="par1">Параграф 1</p>
  <p>Параграф 2</p>
  <p>Параграф 3</p>
</body>
</html>
 
<script>
$('.par1')
  .appendTo(document.body);
/* перемещение 1-го параграфа в конец документа */
</script>

Параграф 2

Параграф 3

Параграф 1