jQuery - 텍스트에서 ul 목록 만들기

Question

나는 ul 목록으로 변경하려는 텍스트 블록을 가지고 있습니다. 텍스트가 깨지는 위치를 결정하려면 다음과 같은 문자를 사용할 수 있다고 생각했습니다./ 그래서 텍스트가 될 수 있습니다.

<p> 
     /Red Car/Green Car/Black Car 
    </p> 

나는 이와 같은 목록이 필요합니다.

<ul> 
     <li>Red Car</li> 
     <li>Green Car</li> 
     <li>Black Car</li> 
    </ul> 

저는 이렇게 해보려고했습니다.

 $(function(){ 
     var list = ''; 
     $('.whatWeDo').find('=').each(function(){ //.whatWeDo id the <p> 
      list += '<li>' + $(this).next() + '</li>'; 
     }); 
     var theList = $('ul').append(list); 
     $('.whatWeDo').html(theList); 
     }) 

Answer 1

이 시도 : jsFiddle example

Answer 2

.find()

var items = $('p').text().trim().split('/'); 
$('p').replaceWith('<ul>'); 
for (var i = 0; i < items.length; i++) { 
    if(items[i].length >0) $('ul').append('<li>' + items[i] + '</li>'); 
} 

는 jQuery를 선택하지 텍스트를 찾습니다.

jQuery(function ($) { 

    // Get your original list, and its text 
    var $original = $('#original'); 
    var text = $original.text(); 

    // Split the text at every '/', putting the results into an array 
    var listItems = text.split('/'); 

    // Set up a new list 
    var $list = $('<ul></ul>'); 

    // Loop through the list array, adding an <li> for each list item 
    listItems.each(function(item){ 
     $list.append('<li>' + item + '</li>'); 
    }); 

    // Replace the old element with the new list 
    $original.replaceWith($list); 

});