Как менять HTML элементы местами с помощью JS?
То что вам нужно - insertBefore (MDN)
<section class="wrapper">
   <div class="item">Блок 1</div>
   <div class="item">Блок 2</div>
   <div class="item">Блок 3</div>
   <div class="item">Блок 4</div>
   <div class="item">Блок 5</div>
</section>

var itemListParent = document.querySelector('.wrapper');
var itemList = document.querySelectorAll('.item');

// сработает как appendChild (т.к. второй аргумент null) - поместит второй элемент в конец родительского.
itemListParent.insertBefore(itemList[1], null);

// сработает как того предполагает insertBefore() - вставит пятый элемент перед первым
itemListParent.insertBefore(itemList[4], itemList[0]);

Плюс применения insertBefore (или appendChild) в том, что прикрепленные слушатели к элементу не сотрутся как в случае использования innerHTML.
Посмотрите в сторону свойства order в CSS Flexbox