title: JavaScript throws TypeError saying that my variable is undefined
body: <p>I don't have much experience in JavaScript, so far I have this:  </p>
  
  <pre><code>  function loop() {
      var authorDivs = document.getElementById('ctl00_MainContent_MCPObjectInfo_dvCreatorView').getElementsByTagName("div");
  
      for (var i = 0; i &lt; authorDivs.length; i++) {
          var divOfDiv = authorDivs[i].getElementsByTagName("div");
  
          if (typeof divOfDiv.item(i) === 'undefined' || divOfDiv.item(i) === null) {
              console.log("This is undefined or null");
          }
          else {
              var realDivs = divOfDiv.item(i);
              realDivs.item(i).textContent = "please work plz";
          }
      }
  }
  </code></pre>
  
  <p>I get the following error from the console in FireFox: <code>TypeError: realDivs is undefined</code> on this line: <code>realDivs.item(i).innerHTML = "please work plz";</code></p>
  
  <p>Essentially what I have (in my mind) is a loop that goes through <code>authorDivs</code> and gets all of the <code>divs</code> within those <code>divs</code> and saves them in <code>divOfDiv</code>. I then check to see if the <code>divs</code> in <code>divOfDiv</code> are <code>undefined</code> or <code>null</code>, if they are <strong>not</strong> then those <code>divs</code> get saved in a variable <code>realDivs</code> which I then use to edit the innerHTML. That's what I'd ideally like to see happen, what is causing the error? What am I doing wrong? </p>
  
  <p>Note: I do not have access to jQuery but only JavaScript.</p>
  
  <p>Edit: I've added the changes suggested below and its fixed that -- thanks! But I'm now getting the following error: <code>TypeError: realDivs.item is not a function</code></p>
  
  <p>What is causing that? And on another note how do I know when I'm dealing with an array and when I'm dealing with an HTMLCollection? Do you just assume? I've never used a loosely typed language before so its new to me. </p>