Случайный обмен DOM (без jQuery)

document.getElementById("pButton").addEventListener("click", () => {
  let max = document.querySelectorAll("p").length - 1;
  let min = 0;
  let x1 = Math.round((Math.random() * (max - min)) + min);
  let x2 = Math.round((Math.random() * (max - min)) + min);
  while (x1 === x2) {
    x2 = Math.round((Math.random() * (max - min)) + min);
  }
  
  let tmp1 = document.querySelectorAll("p")[x1];
  let tmp2 = document.querySelectorAll("p")[x2];
  
  // it is nice to get direct reference, don't you think?
  let parentDiv = document.getElementById('parent');

  // get the previous element of first element you need to change
  let tmp1PrevEle = tmp1.nextElementSibling;
  // this is for the second one
  let tmp2PrevEle = tmp2.nextElementSibling;
  // insert both based on the previous and next elements
  parentDiv.insertBefore(tmp2, tmp1PrevEle);
  parentDiv.insertBefore(tmp1, tmp2PrevEle);
});

<div id="parent">
  <h1>List</h1>
  <p>p1</p>
  <ol>
    <li>first</li>
    <li>second</li>
  </ol>
  <a>example</a>
  <p>p2</p>
  <ol>
    <li>first</li>
    <li>second</li>
    <li>third</li>
  </ol>
  <a>example</a>
  <!-- just to see the randomness, I've added two more elements -->
  <p>p3</p>
  <ol>
    <li>first</li>
    <li>second</li>
    <li>third</li>
  </ol>
  <a>example</a>
  <p>p4</p>
  <ol>
    <li>first</li>
    <li>second</li>
    <li>third</li>
  </ol>
  <a>example</a>
</div>
<button id="pButton">BUTTON</button>