Jquery get each div's sub child divs and grab info into an array
<p>I have a some html that looks like this</p>

<pre><code>&lt;div id="main"&gt;
  &lt;div id="sub_main_1" class="sub_main"&gt;
      &lt;input type="text" class="sub_name_first" /&gt;&lt;br /&gt;
      &lt;input type="text" class="sub_name_second" /&gt;&lt;br /&gt;
  &lt;/div&gt;
  &lt;div id="sub_main_2" class="sub_main"&gt;
      &lt;input type="text" class="sub_name_first" /&gt;&lt;br /&gt;
      &lt;input type="text" class="sub_name_second" /&gt;&lt;br /&gt;
  &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>I would like to pull out each sub_main divs information into an array in javascript. So far I have this as my jquery code</p>

<pre><code>$('#main').find('.sub_main').each( 
          function() { 
               alert('hi'); 
          });
</code></pre>

<p>The alert is just a test that it should show "hi" twice. But this is not working. I am also not clear on how I can store the two inputs in a javascript array. Any help would be great! Thanks,</p>
