title: Mutation Observer causing infinite loop
body: <p>I'm trying to modify the images of a website that uses react and takes the images via API and generates a gallery with Mutation Observer but has caused an infinity loop error. The result I have with this code is this:</p>
  
  <p><strong>RESULT</strong></p>
  
  <pre><code>herehttp://www.image.com/image.jpg
  hereherehttp://www.image.com/image.jpg
  herehereherehttp://www.image.com/image.jpg
  hereherehereherehttp://www.image.com/image.jpg
  herehereherehereherehttp://www.image.com/image.jpg
  hereherehereherehereherehttp://www.image.com/image.jpg
  herehereherehereherehereherehttp://www.image.com/image.jpg
  </code></pre>
  
  <p><strong>CODE</strong></p>
  
  <pre><code>document.addEventListener('DOMContentLoaded',function(){
  
  const muta = document.querySelector("#root");
  const observer = new MutationObserver(function(mutations) {
  
             mutations.forEach(function (mutation) {
  
                  mutation.addedNodes.forEach(function (node) {
  
                      if (typeof node.getElementsByTagName !== 'function') {
                          return;
                    }
  
                    let section = document.getElementsByTagName('section')[0];
                    let images = section.getElementsByTagName('img');
  
                    Array.from(images).forEach(function(image){
                      let newimg =  'here'+image.src;
                      if(image.src !== newimg){
  
                        image.src = newimg;
                      }
  
                    });
  
  
              });
  
           });       
  
  });
  
  var observerConfig = {
    attributes: true,
    childList: true,
    attributeOldValue: true,
    characterData: true,
    subtree: true
  }
  observer.observe(muta, observerConfig);
  });
  </code></pre>