Any way to trigger fancybox 3 with a class instead of data-fancybox attribute?

Question

I have image links added dynamically (Ajax) which only contain a specific class, and I'd like to make them work with Fancybox 3. So, is there any way to trigger fancybox 3 with a class instead of the data-fancybox attribute? I've tried to specify the selector but no success.

The other solution would be to add the attribute with jQuery, but as it's dynamically loaded, it doesn't worked with this.

Rendered HTML

<a href="IMAGE_URL" class="thickbox" >
    <img src="THUMBNAIL_IMG" />
</a>

JS

jQuery(document).ready(function($) {                
    $.fancybox({
        type : 'image',
        selector : '.thickbox'
    });
    $('.thickbox').attr('data-fancybox');
});

I searched for a solution but I didn't find one yet so I'm stuck.

Answer 1

Ok, I finally found the working solution solution thanks to this CODEPEN.

jQuery(document).ready(function($) {   
    $().fancybox({
        selector : '.thickbox'
    });
});

This makes Facybox 3 working with a class name only, and so without having to use the data-fancybox attibute.

BTW, I didn't mention it but my purpose was to replace the native Thickbox lightbox used by some WP plugins (Activity Plus Reloaded for BuddyPress in my case) in the wordPress frontend.

Here is the full PHP snippet i've made to disable Thickbox in frontend and add Fancybox to WordPress without using a plugin.

<?php

// DISABLE THICKBOX LIGHTBOX FRONTEND

function wpse71503_init() {
    if (!is_admin()) {
        wp_deregister_style('thickbox');
        wp_deregister_script('thickbox');
    }
}
add_action('init', 'wpse71503_init');

// ADD FANCYBOX LIGHTBOX

function fancy_enqueue_scripts() {
    if (!is_admin()) {
        wp_enqueue_script( 'fancybox-script', 'https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.min.js', array(), '', true );
    }
}
add_action( 'wp_enqueue_scripts', 'fancy_enqueue_scripts' );

function fancy_CSS_callback() {
    if (!is_admin()) {
        wp_enqueue_style( 'fancybox-style','https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.css' );
        ?>
        <script type="text/javascript">
            jQuery(document).ready(function($) {                
                $().fancybox({
                    selector : '.thickbox, .fancybox'
                }); 
            }); 
        </script>
        <?php
    }   
};
add_action( 'wp_footer', 'fancy_CSS_callback' );

?>

Hope this may help someone.