title: Inserting html div elements into 2-dimensional array
body: <pre><code>var mainCube = Array.prototype.slice.call(document.querySelectorAll('.mainCubeClass'));//assume there are **three**
  if (mainCube !== null) {
      for (k = 0; k &lt; mainCube.length; k++) {
          mainCube[k] = new Array(15);
      } //fill each slot in the array with an array of 15 slots
      document.write("Check1");//everything good so far
      for (var i = 0; i &lt; mainCube.length; i++) {
          document.write("Check2");//okay, still good
          for (var j = 0; j &lt; mainCube[i].length; j++) { //this is now 15
              document.write("Check3");//everything still as expected
              mainCube[i][j] = document.createElement('div');
              mainCube[i][j].className = '.letterPix';
              mainCube[i].appendChild(mainCube[i][j]);
              document.write("Check4"); //doesn't execute
          }
      }
  </code></pre>
  
  <p>I need to enter <code>div</code> elements into a 2dimensional array. I want to create these divs dynamically because the <code>.mainCubeClass</code> may vary from page to page. I've done this with 1d arrays but I've hit a wall now that I cannot seem to get past with 2d arrays and I've narrowed the area of error to the spot in between "check3" and "check4" but I can't seem to find a solution. Does anyone think they may know how to insert every new element created into a slot of my 2d array.</p>
  
  <p>For example, if there are 3 <code>.mainCubeClasse</code> then there should be a total of 45 elements being created and inserted at position <code>mainCube[0][0]</code>...<code>mainCube[0][1]</code> etc. etc.</p>