在某些情况下无法使用附加内容的Click事件

Question

＆＃13;

＆＃13;

$(document).ready(function(){
  $("#itemlist").append("<li>TEST<input type='button' class='toggle_popup_menu' value='edit'></li>");
  getDataFromDb();
$("#itemlist").append("<li>TEST<input type='button' class='toggle_popup_menu' value='edit'></li>");
  addTogleListeners();
$("#itemlist").append("<li>TEST<input type='button' class='toggle_popup_menu' value='edit'></li>");
  });

function getDataFromDb(){
	 //alert('haal gegevens op');
	 var url="http://rubenkoops.nl/medialab/php/json.php";
 	$.getJSON(url,function(result){
		console.log(result);
		//$("#itemlist").empty()
		
		$.each(result, function(i, field){
			var id=field.id;
 			var name="<h1>"+field.name+" ("+id+")</h1>";
 			var type=field.type;
 			var state=field.state;
			
 			$("#itemlist").append("<li>"+name+type+state+"<input type='button' class='toggle_popup_menu' value='edit'></li>");
 			});
 		});
		alert("items binnengehaald");
  
}

function addTogleListeners(){

	$(".toggle_popup_menu").click(function(){
		var checkBox = $("#popup_checkbox");
		checkBox.trigger('click');
		});
};

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="popup_checkbox">
<div id="itemlist">
</div>

＆＃13;

＆＃13;

＆＃13;

我有一个奇怪的问题，由于某种原因，一些附加元素不会触发点击事件，我添加了一个代码片段。前两个工作，其余的没有......