Условно перенести строки в теги <li>и удалить первый символ

Question

Используя следующий html, мне нужно обернуть тег <li> вокруг каждой строки, начинающейся с тире, удалить штрих, а затем обернуть весь список в тег <ul>.

<div class="json-content">
This line doesn't have a dash
This line also doesn't have a dash 
-An unordered list should start here because the line starts with a dash
-This line starts with a dash and has some dashes-in-the-middle
-Another line that starts with a dash
And another a line that doesn't have a dash.
</div>

Я использовал приведенный ниже код (, основанный на предыдущем вопросе ), чтобы достичь этого, но когда в div есть другой не пунктирный текст, он добавляет тег <li> вокруг этих строк, тоже. Я знаю, что часть проблемы заключается в том, что сначала она удаляет черту, но я пытался использовать тестер регулярных выражений, чтобы изменить ее, и я просто не могу понять это. Как мне этого добиться?

 $('.json-content').each(function() {
      var $this = $(this);

      $this.html(
        $this
          .html()
          .trim()
          .replace(/^-|[\r\n]+-/g, "\n")
          .replace(/[^\r\n]+/g, '<li class="item">$&</li>')    
          );
          $(this).find('li.item').wrapAll( "<ul class='json-list' />");  
    });

Вот скрипка: https://jsfiddle.net/9xd2vacj/2/

Конечный результат должен выглядеть следующим образом:

В этой строке нет тире
В этой строке также нет тире

• Здесь должен начинаться неупорядоченный список, потому что строка начинается с тире
• Эта строка начинается с тире и содержит несколько штрихов в середине
• Еще одна строка, начинающаяся с тире

И еще одна строка, в которой нет тире.

Answer 1

Вы можете добавить дефис ^[ \t]*-.*, чтобы он соответствовал строкам, начинающимся с гипса. Затем захватите элемент списка в группе захвата и сопоставьте 0+ раз символ пробела и дефис.

(<li class="item">)\s*-

В замене используйте пустую строку.

Ваш код может выглядеть следующим образом:

$('.json-content').each(function () {
    var $this = $(this);
    $this.html(
        $this
            .html()
            .trim()
            .replace(/^[ \t]*-.*/gm, '<li class="item">$&</li>')
            .replace(/(<li class="item">)\s*-/g, "$1")
    );
    $(this).find('li.item').wrapAll("<ul class='json-list' />");
});

Обновленная скрипка

$('.json-content').each(function () {
    var $this = $(this);
    $this.html(
        $this
            .html()
            .trim()
            .replace(/^[ \t]*-.*/gm, '<li class="item">$&</li>')
            .replace(/(<li class="item">)\s*-/g, "$1")
    );
    $(this).find('li.item').wrapAll("<ul class='json-list' />");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="json-content">
    This line doesn't have a dash
    This line also doesn't have a dash
    -An unordered list should start here because the line starts with a dash
    -This line starts with a dash and has some dashes-in-the-middle
    -Another line that starts with a dash
    And  a line that doesn't start with a dash but has-one in the middle.
</div>

Answer 2

Вы можете объединить:

• заменить
• .html (функция)

$('.json-content').html(function (idx, oldhtml) {
    return oldhtml.replace(/\n *-([^\n]*)/g, function(match, p1) {
        return '<li>' + p1 + '</li>';
    })
}).find('li').wrapAll("<ul/>");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="json-content">
    This line doesn't have a dash
    This line also doesn't have a dash
    -An unordered list should start here because the line starts with a dash
    -This line starts with a dash and has some dashes-in-the-middle
    -Another line that starts with a dash
    And another a line that doesn't have a dash.
</div>