JQuery получает все атрибуты данных из списка

У меня есть длинный динамически сгенерированный список с одним и тем же идентификатором класса и атрибутом данных, похожим на следующий код:

<ul>
    <li class="list" data-id="123">One</li>
    <li class="list" data-id="124">Two</li>
    <li class="list" data-id="125">Three</li>
    <li class="list" data-id="126">Four</li>
    .....etc
</ul>

Я пытаюсь получить все значения data-id и отформатировать их следующим образом:

123|124|125|126....etc

это будет затем передано на страницу через ajax, а идентификатор проверен на наличие в базе данных.

var delimited_data="";
$('.list').each(function(){
    delimited_data+=$(this).data('id')+"|";
});
console.log(delimited_data);

Причина, по которой я задаю этот вопрос, заключается в том, что я работаю над живой системой, которая автоматически развертывает элементы в столбцах списка для разных пользователей через 10 минут. Мне просто нужно быть уверенным, что код идет правильно:)

Мне также нужно проверить, что на странице нет классов .list (т.е. - никак не сделать запрос), будет ли delimited_data полностью пустым, и я уверен, что это будет.

Есть ли лучший способ, чем использовать .each() в этом случае, поскольку я считаю, что это может быть довольно медленным, если учесть, что указанная выше функция будет выполняться каждые 30 секунд.

Ответы

var dataList = $(".list").map(function() {
    return $(this).data("id");
}).get();

console.log(dataList.join("|"));

var array = [];

$('li.list').each(function() {
  array.push($(this).data('id'));
})

var joined = array.join('|');

var arrayOfObj = $('input').map(function() {

  return {
            name : $(this).attr('name'),
            data : $(this).data('options'),
            value : $(this).val(),
            id : $(this).attr('id')
         }

}).get();
console.log(arrayOfObj)