JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
  <li>0</li>
  <li>1</li>
  <li class="fix">2</li>
  <li>3</li>
  <li>4</li>
  <li class="fix">5</li>
</ul>
<p>Note: 2 and 5 fixed!</p>

JavaScript

var parent = document.querySelector('ul'),
    children = [].slice.call(parent.children),
    mixThem = [],
    fixed = {}

children.forEach(function(child, index){
	if (child.className == 'fix') {
  	fixed[index] = child
  } else {
  	mixThem.push(child)
  }
})

for (var i=0; i<children.length; i++) {
	if (fixed[i]) {
  	parent.appendChild(fixed[i])
  } else {
  	parent.appendChild(mixThem.splice(Math.floor(Math.random() * mixThem.length), 1)[0]);
  }
}

var second = $('ul li:eq(1)')
second.html(second.html() + ' second')

var fourth = $('ul li:eq(3)')
fourth.html(fourth.html() + ' fourth')