title: Removing the last comma separator in each list
body: <p>I have a series of unordered lists wrapped in another unordered list. The task is to separate the individual li tags with commas and omitting the each list's last li tag. </p>
  
  <p>I can do it on an individual list level i.e. When testing with just one list I was able to remove the last comma from the last element. But when I'm trying to apply the JavaScript in affects the last li element of the wrapping ul...</p>
  
  <p>Here is my code:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
              $(document).ready(function () {
  
                  $('.tagsList li span').each(function () {
                      $(this).append(',');
                  });
                  var lTag = $('.tagsList li:last span').text().replace(',','');
                  $('.tagsList li:last span').text(lTag);
              });
  
  &lt;/script&gt;
  &lt;ul class="postsList"&gt;
      &lt;li&gt;
          &lt;ul class="tagsList"&gt;
              &lt;li&gt;&lt;span&gt;tag1&lt;/span&gt;&lt;/li&gt;
              &lt;li&gt;&lt;span&gt;tag2&lt;/span&gt;&lt;/li&gt;
          &lt;/ul&gt;
          &lt;/li&gt;
  &lt;li&gt;
      &lt;ul class="tagsList"&gt;
          &lt;li&gt;&lt;span&gt;tag1&lt;/span&gt;&lt;/li&gt;
          &lt;li&gt;&lt;span&gt;tag2&lt;/span&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>