title: Foreach in jQuery
body: <p>I'm trying to prepend a tag to each h2 based on the content that specific h2. Here's what I've tried:</p>
  
  <pre><code>jQuery(document).ready(function() {
      jQuery( "h2" ).each(function(){
          var $headingcontent = jQuery('h2').html().toLowerCase();
          jQuery('h2').prepend('&lt;a id="'+ $headingcontent +'"&gt;&lt;/a&gt;');
      });
  });
  </code></pre>
  
  <p>However, this seems to only get the content of the first h2 and prepend it to every h2, it does this multiple times depending on how many h2's are on the page.</p>
  
  <p>What I would like it to do is turn this:</p>
  
  <pre><code>&lt;h2&gt;Heading 1&lt;/h2&gt;
  &lt;h2&gt;Heading 2&lt;/h2&gt;
  </code></pre>
  
  <p>in to</p>
  
  <pre><code>&lt;h2&gt;&lt;a id="heading 1"&gt;&lt;/a&gt;Heading 1&lt;/h2&gt;
  &lt;h2&gt;&lt;a id="heading 2"&gt;&lt;/a&gt;Heading 2&lt;/h2&gt;
  </code></pre>