내 JQuery 정렬의 각 항목에 "바꾸기"버튼을 추가하는 방법

Question

내 JQuery 정렬 가능 항목의 각 항목에 어떻게 단추를 넣을 수 있는지 궁금합니다. 지금은 자동 완성의 사용자 입력을 정렬 가능한 항목에 추가하는 버튼이 화면 상단에 있습니다.

var $li = $("<li class='ui-state-default'/>").text(liArray[i]); 

하지만 그나마 :

$(".addButton").click(function(e) { 
    e.preventDefault(); 
    // set var item to be the string inputted by the user 
    var item = $("input[name='inputItem']").val(); //where 'inputItem' is the name of the <form> which contains the <input> 
    // parses input string, splitting at commas into liArray containing substrings as elements 
    var liArray = item.split(", "); 
    // for loop to add each brew to the sortable list (length-1 because last element in array is empty string) 
    for (var i = 0; i < liArray.length-1; i++) { 
     // sets var $li to the string in the ith index of liArray 
     var $li = $("<li class='ui-state-default'/>").text(liArray[i]); 

     // adds var $li to gui 
     $("#sortable").append($li); 
    }; 

    $("#sortable").sort(); 

    // refreshes the page so var $li shows up 
    $("#sortable").sortable("refresh"); 
}); 

내 생각은이 라인에

<button>Button!</button> 

같은 것을 추가했다 : 여기 내 정렬에 새로운 항목을 추가 내의 .js 코드는 정확하게 구현하는 방법을 알아야합니다. 어떤 도움을 주시면 감사하겠습니다. 감사!

Answer 1

시도해보십시오.

$("<li class='ui-state-default'/>").text(liArray[i]).append('<button>Button!</button>');