dongcheng dongcheng - 8 months ago 37
jQuery Question

Get the selected list value from dynamically created order list using jQuery

I have a created dynamic order list with class name as follows

$orderList = $('.questOl');

for(var i=0; i<questList.length; i++){
tr.push('<li class="questList">' + questList[i].questText + '</li>');

Then I want to get the list value when I selecting it. I have tried several code snippet in this website. It give undefined value. The closest attempt using this line of code.

var x = $('.questOl').find('.questList').text();

But it take all the value from the list. What I want is current selected value only. Any idea?


Here are the things you can do :

  1. Create li using dynamic element creating rather writing html. ( optional )


for(var i=0; i < questList.length; i++)
      class : "questList",
      text : questList[i].questText 
      text : " " 
  1. Getting the li value on selecting it.

    Since you are creating the elements dynamically, you can delegate a click event on the li you created and register it on the document level so that the document could listen to the markup.


$(document).on('click','.questOl .questList', function()
    var selectedLiText = $(this).text();