Добавить разделы внутри HTML с помощью JavaScript

Question

<div class="main">
<section>...</section>
<section>...</section>
</div>

Его можно добавить <sections> внутри класса div с использованием JavaScript?

Я хочу, чтобы у пользователя была опция при нажатии кнопки, которая добавляет новый <section> внутри основного класса div.

Я хочу использовать эту http://www.thepetedesign.com/demos/onepage_scroll_demo.html библиотеку, для которой требуется основной div и внутри основного несколько разделов, которые будут разделены на страницы для каждого раздела.

Благодарю.

Редактировать: Спасибо, Дэвид после прочтения ваших ответов, я сделал это:

$('<div id="onepage"></div>');
$('<div/>').addClass('main');

$("#main").onepage_scroll({
sectionContainer: "section",
responsiveFallback: 600,
loop: true
});

и для нажатия кнопки действий:

$('<section/>').appendTo('#main');

Но все равно делаю мне бои. Вы говорите по-испански? PS: мы можем воссоздать это в jsfiddle? Есть ссылка с необходимыми ресурсами: http://jsfiddle.net/33WJx/1018/

Answer 1

Да, в нативном javascript это комбинация создания элемента и его добавления.

function createAndAppendSection() {
  let sec = document.createElement('section');
  let div = document.querySelector('#main');
  div.appendChild(sec);
}

Если вы хотите использовать вместо этого jquery, синтаксис немного проще:

$('<section/>').appendTo('#main');

Изменить: чтобы ответить на ваш дополнительный вопрос, если вы хотите добавить элемент с классом, да, вы можете сделать то же самое, что вы предложили для идентификатора... однако я думаю, что предпочтительный способ сделать это "jquery", вероятно, будет:

$('<div/>').addClass('main');

И если вы хотите добавить это в тело документа, вы можете просто добавить .appendTo(document.body),