子附加元素上的click事件

Question

我正在尝试对嵌套的附加元素运行click事件。

       $(document).ready(function () {
        var year;
        var month;
        var day;


        $(".table-list").one("click", function (e) {
            year = $(this).data("year")
            var this_li = $(this)
            $.get( "get_months/"+year, function( data ) {
              $.each(data, function (key, val) {
                  $(this_li).append('<ul class="sub"><li class="month-list" data-month='+val["_id"]+'>'+val["_id"]+'-'+year+'</li></ul>')
              });
            });
        });

        $(".table-list").delegate(".month-list", "click", function(){
            if($(this).data("clicked"))
            {
                return false;
            }
            month = $(this).data("month")
            var this_li = $(this)
            $.get( "get_days/"+year+"/"+month, function( data ) {
             $.each(data, function (key, val) {
                  $(this_li).append('<ul class="sub"><li class="source_list" data-day='+val["_id"]+'>'+val["_id"]+'-'+month+'-'+year+'</li></ul>')
              });

            });
            $(this).data("clicked", true);


        });

        $(document).on("click", ".source_list" , function() {
        alert("bla")
         });

    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

但是“ source_list”上的单击事件不起作用。 如何使用jquery访问此元素？ 我也尝试过委托，但是它也行不通。