Как поменять порядок элементов оставив первый элемент на месте?

Question

[Lavrov95]

<div id="reverse">
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
</div>

результат

<div id="reverse">
    <div>1</div>
    <div>4</div>
    <div>3</div>
    <div>2</div>
</div>

Comments

[Andrew]

https://codepen.io/kickerock/pen/wbrbvB

Answer 1

[RAX7]

Array.from(document.querySelectorAll('#reverse > div'))
  .slice(1)
  .sort((a, b) => parseInt(b.textContent) - parseInt(a.textContent))
  .forEach(el => el.parentElement.appendChild(el));

Comments

[alexkhismatulin]

Почему не сделать reverse вместо sort? Сомневаюсь, что контент нужно действительно отсортировать, скорее просто развернуть.

[RAX7]

alexkhismatulin, в вопросе не сказано как нужно поменять местами элементы, возможно и в правду нужен просто reverse

Answer 2

[abberati]

Если вопрос в отображении, то можно сделать на чистом css с помощью флексбокса и свойства order.