Setting outerHTML for members of an array

Issue

While (a) iterating on a group of elements from document.getElementsByClassName and (b) setting outerHTML for each element, latter elements become inaccessible in an ascending for-loop.

This is only triggered for outerHTML, not for innerHTML.

Current workaround

Iterate in descending order or use innerHTML instead.

Experiment

• 2 groups of divs, member divs have one of 2 class names: while-descending or for-ascending
• See code for implementation detail

Iterating from end of array

Iterating from start of array