Jquery: не могу выбрать добавляемый элемент

Question

Я пытаюсь отобразить предупреждение, когда нажимаю на ссылку внутри ul li, но почему-то это не работает. Мой jquery не может выбрать ссылку, которую я добавляю.

МОЙ HTML

<ul id="typeList"></ul>

МОЙ JQUERY

 $("a.type").on("click", function(){                
            alert("click");
 });

$("<li><a href='#' class='type' type =" +results.rows.item(i).Type + " >"+ results.rows.item(i).Type +"</a></li>").appendTo('ul#typeList');

ЖЕЛАЕМАЯ ЛИНИЯ СОЗДАНА

<ul>
   <li><a class="type" href='#' type ='People'>People</a></li>
   <li><a class="type" href='#' type ='Places'>Places</a></li>
</ul>

Answer 1

Изменить ваш on триггер, чтобы ловить события кликов внутри ul:

 $("#typeList").on("click", "a.type", function(){                
            alert("click");
 });

Это прикрепляет обработчик событий только к одному элементу (ваш ul#typeList), но это будет работать только для a.type элементы внутри ul,

Answer 2

Вы не можете прикрепить обработчик событий к элементу, который еще не существует!

Делегируйте событие элементу, который существует, как в ответе, заданном @des, или добавьте элемент перед тем, как присоединить обработчик:

$("<li><a href='#' class='type' type =" +results.rows.item(i).Type + " >"+ results.rows.item(i).Type +"</a></li>").appendTo('ul#typeList');

$("a.type").on("click", function(){                
    alert("click");
});
​

FIDDLE

Answer 3

Попробуйте это для получения на клике

$(function(){
   $(".type").click(function(){                
                alert("click");
     });
});