在我的情况下，为什么LazyLoad对动态元素不起作用？

Question

我的动态图像未使用LazyLoad加载

index.cshtml

<div id="my-card-rows">

</div>

<script src="https://cdn.jsdelivr.net/npm/vanilla-lazyload@12.0.0/dist/lazyload.min.js"></script>

<script>
    const myLazyLoad = new LazyLoad({
        elements_Selector: ".my-card-img-load"
    });
</script>

请参见下面的 index.js ，首先我添加一个div class='row mobile-bg-pic my-card-row-" + i + "'，再次我将我最近添加的另一个div my-card-row-" + i + "'

index.js

$(document).ready(function () {
var total_rec = 1
for (var i = 1; i <= total_rec; i++) {
    console.log("testing");
    $('#my-card-rows').append("<div class='row mobile-bg-pic my-card-row-" + i + "' id='sale-pic'></div>");

    $(".my-card-row-" + i + "").append('<div class="col-6 col-md-3 col-nopadding">'+
    '<img class="card-img-top my-card-img-load" data-src="/img/Home/2.jpeg" alt="Card image cap">' +
    '</div>')
}
$(".my-card-img-load").lazyload();

我的正常图像正在加载，没有任何问题