You're using a "direct" event handler. It will only be attached to elements which already exist when the statement runs. If you create another element later and add it to the page, the event handler will not be attached.
Use a delegated event handler instead:
$(function(){
$(document).on("click", "ul.cls-ul li", function(e) { alert(this); });
}); .on() | jQuery API Documentation[
^]
NB: You should also pay attention to the notes in the
ready documentation:
jQuery offers several ways to attach a function that will run when the DOM is ready. All of the following syntaxes are equivalent:
$( handler )$( document ).ready( handler )$( "document" ).ready( handler )$( "img" ).ready( handler )$().ready( handler )
As of jQuery 3.0, only the first syntax is recommended; the other syntaxes still work but are deprecated.
Submit an article or tip