title: JQuery get all data attributes from a list
body: <p>I have a long dynamically generated list each with the same class identifier and a data attribute similar to the code below:</p>
  
  <pre><code>&lt;ul&gt;
      &lt;li class="list" data-id="123"&gt;One&lt;/li&gt;
      &lt;li class="list" data-id="124"&gt;Two&lt;/li&gt;
      &lt;li class="list" data-id="125"&gt;Three&lt;/li&gt;
      &lt;li class="list" data-id="126"&gt;Four&lt;/li&gt;
      .....etc
  &lt;/ul&gt;
  </code></pre>
  
  <p>what I am trying to achieve is to get all the <code>data-id</code> values and format them in as follows:</p>
  
  <pre><code>123|124|125|126....etc
  </code></pre>
  
  <p>this would be then passed to a page via ajax and the id's checked for existence in a database.</p>
  
  <pre><code>var delimited_data="";
  $('.list').each(function(){
      delimited_data+=$(this).data('id')+"|";
  });
  console.log(delimited_data);
  </code></pre>
  
  <p>The reason I am asking this question is that I am working on a live system that automatically deploys items in the list columns to different users after 10 mins. I just need to be sure that the code is going the right way :)</p>
  
  <p>I also need to check that is there are no <code>.list</code> classes on the page (ie - no way to do the query) whether <code>delimited_data</code> will be totally empty which I am pretty sure it would be.</p>
  
  <p>Is there a better way than using <code>.each()</code> in this case as I find it can be rather slow baring in mind that the above function will be run every 30 seconds.</p>