Magento 2 : jquery execute once element exists #magento2

Magento-2-jquery-execute-once-element-exists.md

<script>
require(['jquery'], function($) {
    $(document).ready( function() {
        var checkExist = setInterval(function() {
            if ($('.element__class').length) {
                // do something
                clearInterval(checkExist);
            }
        }, 500); // check every 500ms
    });
});
</script>

<script>
    // Create a script element
    const script = document.createElement('script');
    // Set the source to the jQuery library
    script.src = 'https://code.jquery.com/jquery-3.6.0.min.js';
    script.type = 'text/javascript';
    // Append the script to the document head
    document.head.append(script);

    // Use the 'load' event to ensure jQuery is loaded before using it
    script.onload = function() {
        $(document).ready(function() {
            var checkExist = setInterval(function() {
                if ($('.element__class').length) {
                    // Do something when the element is found
                    clearInterval(checkExist);
                }
            }, 500); // Check every 500ms
        });
    };
</script>

<script>
    // Function to load a script dynamically
    function loadScript(url, callback) {
        const script = document.createElement('script');
        script.src = url;
        script.type = 'text/javascript';
        script.onload = callback;
        document.head.append(script);
    }

    // Load jQuery first
    loadScript('https://code.jquery.com/jquery-3.6.0.min.js', function() {
        // jQuery is loaded, now load Slick Slider
        loadScript('https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js', function() {
            // Slick Slider is loaded, now initialize it
            $(document).ready(function() {
                var checkExist = setInterval(function() {
                    if ($('.element__class').length) {
                        // Initialize Slick Slider (or perform any action)
                        $('.element__class').slick({
                            // Slick Slider settings
                            dots: true,
                            infinite: true,
                            speed: 300,
                            slidesToShow: 1,
                            adaptiveHeight: true
                        });
                        clearInterval(checkExist);
                    }
                }, 500); // Check every 500ms
            });
        });
    });
</script>