Как получить текст динамически добавленного li из ul в jquery

Question

У меня есть переменная, которая может содержать несколько значений, разделенных запятой. Я хотел разбить и динамически отобразить в lis в неупорядоченном списке.

Когда щелкнули каждый li, мне нужно взять текст внутри li для использования в более поздней функции. Я попытался сделать это ниже неудачно.

Пожалуйста, помогите мне получить текст каждого ли, когда он щелкнут.

function viewUploadedFiles() { 
var fpath = $("#filePathList").val(); 
var fnameVal = $("#fileNameList").val(); 
var display = displayFiles(fnameVal); 
$("#upload_FileList").html(display); 
} 

function displayFiles(fname) { 
    var septor = ','; 
    var selected="<ul class='file_List' >"; 
    if (fname.indexOf(septor) >= 0) { 
     var fnameArray = fname.split(septor); 
     $.each(fnameArray, function(index,value) { 
      alert(index+" Files ===> "+value); 
       selected+='<li class="file_list_line" id="file_ID"><span class="text">'+value+'</span><input type="button" value="Delete File" onclick="deleteFile()"></li>'; 
     }); 

    } else { 
     selected+='<li class="file_list_line" id="file_ID"><span class="text">'+fname+'</span><input type="button" value="Delete File" onclick="deleteFile()"></li>'; 
    } 
    selected+='</ul>'; 
    return selected; 
} 

function deleteFile(){ 
alert($(this).text()); 
} 

<div id="upload_FileList" align="left"> 
</div> 

Answer 1

Я сделал небольшое изменение к скрипту, который вы использовали, чтобы заставить его работать на jsfiddle. Проблема, с которой вы столкнулись, заключалась в том, что функция deleteFile() недоступна при нажатии кнопки. Удаление вызова встроенной функции и регистрация вызова с помощью делегирования с помощью jquery устраняет вашу проблему.

Предполагая, что вы поместили сгенерированную разметку html внутри списка, вам нужно добавить это в свой скрипт.

$('#upload_FileList').on('click', 'li', function(){ 
    $(this).css('color', 'red'); 
    console.log($(this).text()) 
}); 

Это просто вызывает функцию всякий раз, когда щелкали LI внутри upload_filelist UL.

Вот функционирование скрипку - http://jsfiddle.net/t99sm54q/1/