title: Using a while loop with an element childNodes.length until it is equal with a specified number doesn't work (while loop can't be exited)
body: <p>I'm trying to build an Instagram script to retrieve a list of people who don't follow you back.</p>
  
  <p>My idea looks like this:</p>
  
  <p>-> open followers tab -> scroll down until all of the followers are shown in the DOM -> add them to an array -> close the tab -> open following tab -> scroll down until all of the following are shown in the DOM -> add them to array -> compare the arrays -> display who doesn't follow you back</p>
  
  <p>That's what I've done so far:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>    selectors = {
           modal: "Y8-fY",
           objList: "isgrP",
           divList: "PZuss"
      };
      x = {};
      x.following = [];
      x.followers = [];
      numberOfFollowers = Number(document.getElementsByClassName(selectors.modal)[1].querySelector('a').querySelector('span').title);
      numberOfFollowing = Number(document.getElementsByClassName(selectors.modal)[2].querySelector('a').querySelector('span').innerHTML);
  
  var openFollowersTab = function()
  {
      document.getElementsByClassName(selectors.modal)[1].querySelector('a').click();
  }
  
  openFollowersTab();
  
  var showFollowers = function (x)
  { 
      document.querySelector("." + selectors.objList).scrollTop = 200;
      document.querySelector("." + selectors.objList).scrollTop = -200;
      while(document.querySelector(".PZuss").childNodes.length != x)
      {
          document.querySelector("." + selectors.objList).scrollTop += 1000;
      }
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>This code has two small problems which I don't know how to deal with.
  First of all, if I call showFollowers() in the script, the page breaks because of the while loop. I can't seem to get why though. In my head this should've been working. In that ".PZuss" are located all of the followers as a li. So until it is equal with the numberOfFollowers, it should scroll down.</p>
  
  <p>I know there should be only one problem per question but this is a small one and I find it even stranger than the first one - until I introduced that while condition (and the code worked, but not how I wanted) if I have called showFollowers()) in the code it said it can't find .PZuss. .PZuss appears in the DOM after the followersTab is opened so I thought I would have to do something like this so the tab is opened first: </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>setTimeout(showFollowers(numberOfFollowers), 10000);</code></pre>
  </div>
  </div>
  
  but it doesn't work either. If I run showFollowers() in the console AFTER the OpenFollowersTab() is closed, everything worked fine. (again, without that while loop).</p>
  
  <p>So the main problem is why that WHILE doesn't work because I find that very strange. If you could give me an insight of how I should wait for the DOM from the followers tab to be loaded, that would be great too, if not, it's fine, I'll find a workaround.</p>
  
  <p>Thanks a lot for your time!
  Have a great day!</p>