AJAX compatibility with lightGallery

[emresaracoglu]

I am using version 1.4.0 to display images. Images come in JSON format with Ajax requests. But when I click on the images I can't view them with lightGallery. Can you tell me where am I missing something?

Settings:

var gallery = function () {
        var gallery = document.querySelectorAll('.gallery');
        if (gallery.length) {
            for (var i = 0; i < gallery.length; i++) {
                lightGallery(gallery[i], {
                    selector: '.gallery-item',
                    download: false,
                    animateThumb: false,
                    videojs: true,
                    youtubePlayerParams: {
                        modestbranding: 1,
                        showinfo: 0,
                        rel: 0
                    },
                    vimeoPlayerParams: {
                        byline: 0,
                        portrait: 0,
                        color: '766df4'
                    }
                });
            }
        }
    }();

DIVs generated with ajax result:

if (itemData.item.phl) {
    for (let phlX = 0; phlX < itemData.item.phl.length; phlX++) {
        document.getElementById('item_photos_larges').innerHTML += '<div class="col-sm-6 mb-grid-gutter"><a class="gallery-item rounded-1" href="' + itemData.item.phl[phlX].url + '"><img alt="' + translate_photo + ' ' + [phlX] + '" src="' + itemData.item.phl[phlX].url + '"></a></div>';
    }
}

HTML:

<div id="gallery" class="">
    <div id="item_photos_larges" class="gallery row"></div>
</div>

Thank you.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. If the issue is still valid for version 2.x, please re-open. Apologize for not responding on time. Thank you for your contributions.