Автоматически вставлять div после кнопки, но в новой строке

Question

Я определил объект кнопки и объект div ( demo ), и чтобы использовать их, я пишу что-то вроде

Usually the <button class=col>cat</button> is a domestic animal.
<div class=con>It is a small mammal.</div>
But it can also be a wild animal.

Используя insertAdjacentHtml () itМожно автоматически добавить элемент div

var button = document.getElementsByClassName("col")[0];
button.insertAdjacentHTML("afterend", "<div class=con>It is a small mammal.</div>");

, но таким образом div добавляется сразу после кнопки

Usually the <button class=col>cat</button><div class=con>It is a small mammal.</div> is a domestic animal.
But it can also be a wild animal.

Есть ли способ (javascript?) для добавления divв строке рядом с той, что содержит кнопку?

Answer 1

Как насчет использования вместо этого?

button.append("<div class=con>It is a small mammal.</div>");