cliick event not happening

Question

this is my function:

function bind_click_user_pages()
{
     $(".card-pages-own").click(function () {
       debugger;
     })
}

the site isnt entering break mode, thing that it should be doing
and this is my function call

 api.post(`/api/blog/get_user_pages`).then(response => {
    response.response.forEach(response => {
        $(".card").append(`  
           <div class="card" id="page_card_${response.id}" datacol1="${response.id}">
           </div> 
        `);        
      });
  });
bind_click_user_pages();

and i dont know whats wrong

Answer 1

First thing, it looks like your missing something in your binding selector: $(".card card-pages") "card-pages" is probably a class or an ID, not an element.

Secondly, the binding function is outside the asynchronous api.post , so your div is probably created after the binding, it will not have the click event attached. To prevent that, you can attach the event to the document like:

$(document).on("click", ".card .card-pages", function() {
  debugger;
});