Ошибка .click на добавленном элементе, даже с .on

Question

У меня возникла ошибка при попытке использовать .click на добавленном элементе div, поэтому я попытался использовать .on вместо этого, но это не решило его. Что не так с последними строками в этом коде?

Элемент .table является расстраивает один:

$('#mapH').focusout(function(){ 
    var i = 0; 
    while (i < $('#mapH').val()) { 
     $('#mapCreator').append("<div class='row'></div>"); 

     var j = 0; 
     while(j < $('#mapW').val()) { 
      $('.row').last().append("<div class='table empty "+i+"-"+j+"'></div>"); 
      j++; 
     } 
     i++; 
    } 
    $('.table').css("width", 100/$('#mapW').val()+"%"); 
    $('.row').css("height", $('.table').width()); 
}) 



$('.table').on("click", function(){ 
    //$('body').append("<div class='popup'></div>"); 
    alert('hej'); 
}) 

Answer 1

Вы, вероятно, имеют дополнительное пространство в классе таблицы после того, как пустой. Измените class='table empty " на class='table empty" и делегируйте событие родительскому .table.empty или документу.

$(document).on("click",'[class^=table]', function(){ 
    //$('body').append("<div class='popup'></div>"); 
    alert('hej'); 
}); 

Answer 2

Вы можете попробовать:

$("div .table").click(function(){ 

// code here 

alert("call"); 

});