JQuery click event is not working on dynamically created li

Question

In my website https://www.giftstoindia24x7.com , on a button click event (in jQuery) I am populating a dynamically created html list. It is working fine but when I am using jQuery click event on dynamically created  ul Li , it is not working.
The code is as follows:
$(document).ready(function() { $('ul.cls-ul li').click(function(e) { alert(this); }); })
Is there any better solution?

Jin Necesario · Answer

Hi Niladri Mandal,   I think I know your issue. When adding dynamic elements within your page, you need to use  . on() function and pass the selector. See the example below. $(document).ready( function () {           /**        * This will work whether the element is already present or dynamically added later.        */        $( "body" ).on( "click" ,  "ul.cls-ul li" ,  function (e) {           alert( this );       });   });    Cheers,  Jin

Salman Beg · Answer

Hey is your ul li correct. Also check this link for reference,
https://drupal.stackexchange.com/questions/36904/how-to-implement-click-event-on-dynamically-generating-li