querySelectorAll doesn’t capture all elements

I am trying to scan and manipulate DOM of a webpage the following Code:

var elements = document.querySelectorAll('*');
for (var i = 0; i < elements.length; i++) {
   if (!elements[i].firstElementChild) { 
       if (elements[i].innerHTML != "" ){ 
           elements[i].innerHTML = "abc_"+ elements[i].innerHTML+"_123";
       }
   }
}

While it works well on many pages, it is not picking up all the elements on a specific page that is my real target. On that page, it captures and edit strings of few elements, but not all.
I have also tried using getElementsByTagName()

The elements that are not captured have an XPath such as:

/html/body/div[4]/div[2]/div/div[2]/div/div/div/div/div[1]/div/div[2]/nav/div/div[1]/div/span/div

I also noticed “flex” written in front for these elements.

Any idea what am I doing wrong?