title: jquery html() give out only first value used with each () method
body: <p>In the following code, using jquery's each() and html() inserts only the first div value i.e. "David Smith" in the whole array (all_names[]) wheres I expected each() to iterate over each div and insert their corresponding value into corresponding array index. </p>
  
  <p>More than code correction, I prefer if anybody can tell me the reason behind such behavior of each() or html() function (I'm not sure). I am a beginner in jQuery and this will help me strengthen my understanding of jquery.</p>
  
  <p>Thanks
  dkj</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div class="test"&gt;&lt;a href="#"&gt;David Smith&lt;/a&gt;&lt;/div&gt;
  &lt;div class="test"&gt;&lt;a href="#"&gt;Adam John &lt;/a&gt;&lt;/div&gt;
  &lt;div class="test"&gt;&lt;a href="#"&gt;Tina Samara &lt;/a&gt;&lt;/div&gt;
  &lt;div class="test"&gt;&lt;a href="#"&gt;James White &lt;/a&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>JQUERY</strong></p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      var all_names = [];
      var total_names = $('div.test a');
  
      total_names.each(
          function() {
               all_names[counter] = total_names.html();
               counter++;
          }
      );      
  
   alert("total Names: " + all_names);
  
   &lt;/script&gt;
  </code></pre>