插入后锚标记上的click事件不起作用

Question

I have added html on run time using .insertAfter() method of jQuery:

var options = '<div class="selectyoursize_block" id="selectyoursize_block_left" style="display:none;"><ul><li><a href="#">S</a></li><li><a href="#">M</a></li><li><a href="#">L</a></li><li><a href="#">XL</a></li><li><a href="#">XXL</a></li></ul></div>';
$(options).insertAfter(selector.eq(4)).slideDown();

$("#selectyoursize_block_left a").on("click", function(e){});

But nothing is working. Any help would be appreciated.

Answer 1

Move the selector to the 2nd parameter selector when calling on . Then on first part selector, use an element that doesn't change eg. document.

$(document).on("click","#selectyoursize_block_left a",function(e){});