title: dynamically add a name anchor tag within dynamic content page
body: <p>I have a page that lists over 100 items and I need to dynamically add a name="" tags to the beginning of each new section of items that starts with the next alphabet.</p>
  
  <p>For example:</p>
  
  <pre><code>&lt;a name="a"&gt;&lt;/a&gt;
  &lt;h1&gt;Amazon River&lt;/h1&gt;
  
  &lt;h1&gt;Arrow Heads&lt;/h1&gt;
  
  &lt;a name="b"&gt;&lt;/a&gt;
  &lt;h1&gt;Bear Claws&lt;/h1&gt;
  
  &lt;h1&gt;Bee Traps&lt;/h1&gt;
  
  &lt;h1&gt;Dodge Ball&lt;/h1&gt;
  
  &lt;a name="f"&gt;&lt;/a&gt;
  &lt;h1&gt;Football Players&lt;/h1&gt;
  
  &lt;h1&gt;Fig Newtons&lt;/h1&gt;
  
  ....
  
  &lt;a name="y"&gt;&lt;/a&gt;
  &lt;h1&gt;Yorktown&lt;/h1&gt;
  
  &lt;h1&gt;Yikes&lt;/h1&gt;
  
  &lt;a name="z"&gt;&lt;/a&gt;
  &lt;h1&gt;Zebra&lt;/h1&gt;
  
  &lt;h1&gt;Zoo Mobile&lt;/h1&gt;
  </code></pre>
  
  <p>I am only familiar w/ php, somewhat familiar w/ javascript, not sure what one it would take to accomplish this.</p>
  
  <p>I will type out the "code" in theory, so you have an idea of what I want to accomplish</p>
  
  <pre><code>$letter = range(a-z);
  
  if($title == first_letter_character($letter)) {
     print '&lt;a name="'.$letter.'"&gt;&lt;/a&gt;';
     $letter++; // goes to next letter in range
  }
  </code></pre>
  
  <p>Also, there may be some letters that may not have an item.</p>
  
  <p>Any help is appreciated.</p>