Stack Exchange
Calling click event on dynamic anchor
I am building the page dynamically and building the anchors at run time.. 
Here is the HTML code 
htmlElement = '<div class="product_card col-lg-3 col-md-4 col-sm-6 col-xs-6" id="' + productValue['product_id'] + '">' +
'<a href="#" class="productDetails">' +
'<img src="' + productImage + '"' + ' width="258" height="202" alt="' + productValue['e_name'] + '"  class="img-responsive"/>
</a>' +'</div>'

I have tried all of these codes
//display product info
$(document).delegate("click",'a.productDetails',function(){
    alert('dddd');
});

//display product info
$('.product_card').on("click",'a',function(){
    alert('dddd');
});

  $('a.productDetails').live("click",function(){
    alert('dddd');
});

Nothing works!! 

https://jsfiddle.net/oLk8w5m4/ this worked for me, when i used .on('click', function() {

you have to delegate from an existing object/element, e.g. $('body').on('click', '.product_card a', function()...)

The order of your delegate is wrong, it is selector first then event. Your on is correct but it needs to be attached to something that is already there like for example document or body. Live is deprecated and should not be used, you should use on.

All of the tries are not working with my code!!! There is sth missing I can't get it!!

The order of Anchor tag creation and use of the event on it needs to be handled carefully. First the function to create the anchor tag needs to be done after that event handling.
     $(document).ready(function(){
           methodToCreateAnchor();
           $('.product_card').on("click",'a',function(){
    alert('dddd');
});
});

