onclick for created Id, does not work

Question

Hello people here is my code below...

            #ajax code after success
            $.each(obj,function(index,Object) {
                ban_list += '<div class="ban_n" id='+Object.To+'>remove ban</div>';

            })

        $('.b_list').html(ban_list).toString();

above code works fine by creating a div with the class=ban_n and id=get1_name get1_name is nothing but Object.To now i have to set onclick for ban_n

$('.ban_n').on('click',function(){
console.log($(this).attr('id'));
})

why is the above code does not work.. anyway to fix this??

Answer 1

Use event delegation method since you have dynamically added that div:

$(document).on('click','.ban_n',function(){
console.log($(this).attr('id'));
})

learn more about event delegation here

Answer 2

I think you have to use delegation

$('.b_list').on('click','.ban_n',function(){
   console.log($(this).attr('id'));
})