title: Recursive read div contents and post via AJAX
body: <p>I created a function that reads the content of some divs and puts them into an array. My divs are organized as such:</p>
  
  <pre><code>&lt;div class="row clearfix" id="moltiplicandum1"&gt;
      &lt;div class="column third"&gt;
          &lt;select id="test_set" type="text" style="width:100%"&gt;
              &lt;option selected disabled value=""&gt;Select...&lt;/option&gt;
              &lt;option value="set1"&gt;set1&lt;/option&gt;
              &lt;option value="set2"&gt;set2&lt;/option&gt;
          &lt;/select&gt;
      &lt;/div&gt;
      &lt;div class="column third"&gt;
          &lt;select id="avail_cat" type="text" style="width:100%"&gt;
              &lt;option selected disabled value=""&gt;Select...&lt;/option&gt;
              &lt;option value="cat1"&gt;cat1&lt;/option&gt;
              &lt;option value="cat2"&gt;cat2&lt;/option&gt;
          &lt;/select&gt;
      &lt;/div&gt;
      &lt;div class="column third"&gt;
          &lt;select id="avail_class" type="text" style="width:100%"&gt;
              &lt;option selected disabled value=""&gt;Select...&lt;/option&gt;
              &lt;option value="class1"&gt;class1&lt;/option&gt;
              &lt;option value="class2"&gt;class2&lt;/option&gt;
          &lt;/select&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="row clearfix" id="moltiplicandum#"&gt;...&lt;/div&gt;
  </code></pre>
  
  <p>From <code>moltiplicandum1</code> to an arbitrary <code>montiplicandum#</code> (all created via js using a button). So, the function that is going to read the contents of all "select" for each "moltiplicandum" returns an error: </p>
  
  <blockquote>
    <p>TypeError: div is null</p>
  </blockquote>
  
  <p>on the line <code>var divs = div.getElementsByTagName('select');</code>. Here the function:</p>
  
  <pre><code>var divArray = [];
  
  for(var i = 1; i &lt; 10; i++) {
      var div = document.getElementById("moltiplicandum"+i);
      var divs = div.getElementsByTagName('select');
  
      for (var j = 0; j &lt; divs.length; j += 1) {
          divArray.push($(divs[j]).val());
      }
  }
  </code></pre>
  
  <p>If I comment the external <code>for</code>, defining <code>var i = 1</code>, it works (only for "moltiplicandum1").</p>
  
  <p>Could someone help me to figure out the problem? Thank you1</p>