Перестройте список из раздела элементов div с помощью jQuery

Question

У меня есть HTML-раздел div, который я хотел бы преобразовать в элемент списка.

Вот пример фрагмента HTML:

<div>
  <small>2019-10-31 10:41 Customer unregistered</small>
</div>
<div>
  <small>2019-08-31 10:41 Customer investigated</small>
</div>
<div>
  <small>Comment:</small>
</div>
<div>
  <small>- payment issue</small>
</div>
<div>
  <small>2019-08-31 10:41 Customer registered</small>
</div>

В конечном счете, я бы хотел, чтобы это был неупорядоченный список NESTED, т. Е.

<ul>
  <li>2019-10-31 10:41 Customer unregistered</li>
  <li>2019-08-31 10:41 Customer investigated
    <ul>
      <li>Comment:</li>
      <li>- payment issue</li>
    </ul>
  </li>
  <li>2019-08-31 10:41 Customer registered</li>
</ul>

Обратите внимание, что записи «основного» списка могут быть идентифицированы с началом даты и времени. "sub" списки и их записи - это те, которые не начинаются с даты и времени.

Есть ли у них кто-нибудь, кто знает, возможна ли эта абракадабра каким-либо образом через jQuery при загрузке документа?

Я понимаю, что могу идентифицировать «основной» элемент списка по первым 16 символам (которые должны представлять объект даты-времени), поэтому я могу попытаться, чтобы они соответствовали регулярному выражению:

var check = isDate('2018-08-01 18:30');
alert(check)

var check = isDate('hungry like a wolf');
alert(check)

function isDate(_date){
        const _regExp  = new RegExp('^(-?(?:[1-9][0-9]*)?[0-9]{4})-(1[0-2]|0[1-9])-(3[01]|0[1-9]|[12][0-9]) (2[0-3]|[01][0-9]):([0-5][0-9])?$');
        return _regExp.test(_date);
    }

Обновление о прогрессивном освещении:

Теперь я могу сканировать элементы основного списка на основе первых 16 символов и посмотреть, соответствуют ли они регулярному выражению. тогда я могу изменить элементы. Я еще не дошел до вложенных списков:

function isDate(_date){
    const _regExp  = new RegExp('^(-?(?:[1-9][0-9]*)?[0-9]{4})-(1[0-2]|0[1-9])-(3[01]|0[1-9]|[12][0-9]) (2[0-3]|[01][0-9]):([0-5][0-9])?$');
    return _regExp.test(_date);
}

$(function() {    
    $("div.histEntry").each(function( index, value ) {
      if(isDate($(value).text().trim().substring(0, 16))){
           var element = $(this);
           element.replaceWith('<li><p><small>' + element.text() + '</small></p></li>');
      }else{
           var element = $(this);
           element.replaceWith('<div><p><small>' + element.text() + '</small></p></div>');
      }
    });
});

Answer 1

jQuery MAP plus Карта массива

Я не видел, чтобы ваши UL были вложенными, пока я не отредактировал ваш вопрос для ясности.

Этот коддаст вам текст, который вы хотите работать в массиве

$("div small")
  .map((i, el) => $(el).text()) // jQuery.map
  .get() 

Моя первая попытка не была вложена

const $container = $("#container");
$container.html(() =>
  $("<ul/>").html(() =>
    $("div small",$container)
    .map((i, el) => $(el).text()) // jQuery.map
    .get() // text array
    .map(el => `<li>${el}</li>`) // Array.map
  )
)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container">
  <div>
    <small>2019-10-31 10:41 Customer unregistered</small>
  </div>
  <div>
    <small>2019-08-31 10:41 Customer investigated</small>
  </div>
  <div>
    <small>Comment:</small>
  </div>
  <div>
    <small>- payment issue</small>
  </div>
  <div>
    <small>2019-08-31 10:41 Customer registered</small>
  </div>
</div>