I’m trying to get my slider component to work. For this I need to load in 2 javascript files:

<script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=6602cf158fccd6b1f9c2c75c" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
  <script src="js/webflow.js" type="text/javascript"></script>

This is my slider component inside my components.js file:

/* ======================================================================================== */
/* ============================================================== SLIDER */
const sliderTemplate = document.createElement('template');
sliderTemplate.innerHTML = `

<link href="css/normalize.css" rel="stylesheet" type="text/css">
<link href="css/webflow.css" rel="stylesheet" type="text/css">
<link href="css/diamond-heart.webflow.css" rel="stylesheet" type="text/css">

<section class="section-wat-we-doen">
    <div class="spacing">
        <div id="w-node-_51899271-5376-bab9-28c6-15a90fc8430a-f9c2c767" class="holder">
            <div id="w-node-_51899271-5376-bab9-28c6-15a90fc8430b-f9c2c767" class="above-title white">Wat we doen</div>
            <h2 class="white">Zodat jij rust vind</h2>
        </div>
        <div data-delay="4000" data-animation="slide" class="slider w-slider" data-autoplay="false" data-easing="ease" data-hide-arrows="false" data-disable-swipe="false" data-autoplay-limit="0" data-nav-spacing="3" data-duration="500" data-infinite="true">
            <div class="mask w-slider-mask">
                <div class="slide w-slide">
                    <div class="w-layout-grid grid-2cols">
                        <div id="w-node-_51899271-5376-bab9-28c6-15a90fc84313-f9c2c767" class="holder"><img src="images/starting-the-classes-2023-11-27-04-53-47-utc-1_1.webp" loading="lazy" sizes="(max-width: 479px) 94vw, (max-width: 767px) 92vw, 94vw" srcset="images/starting-the-classes-2023-11-27-04-53-47-utc-1_1starting-the-classes-2023-11-27-04-53-47-utc-1.webp 500w, images/starting-the-classes-2023-11-27-04-53-47-utc-1_1starting-the-classes-2023-11-27-04-53-47-utc-1.webp 800w, images/starting-the-classes-2023-11-27-04-53-47-utc-1_1starting-the-classes-2023-11-27-04-53-47-utc-1.webp 1080w, images/starting-the-classes-2023-11-27-04-53-47-utc-1_1.webp 1920w" alt="People in a circle" class="image-full-width"></div>
                            <div id="w-node-_51899271-5376-bab9-28c6-15a90fc84315-f9c2c767" class="holder">
                                <h2 class="orange">Advaita Vedanta</h2>
                                <p class="white">Tijdens een gesprek, vergadering en voor langere tijd tijdenswoon- of retraite Diamond Heart wijst voortdurendnaar je ware aard, die niet je lichaam of geest is, maar jouwtijdloze ware natuur, geheel in de Advaita traditie.</p>
                                <a href="wat-we-doen.html" class="button textual w-button">Lees meer<span class="button-arrow"> </span></a>
                            </div>
                        </div>
                    </div>
                <div class="slide w-slide">
                    <div class="w-layout-grid grid-2cols">
                        <div id="w-node-_51899271-5376-bab9-28c6-15a90fc8431e-f9c2c767" class="holder"><img src="images/relaxing-on-workshops-2023-11-27-05-12-22-utc-1_1.webp" loading="lazy" sizes="(max-width: 479px) 94vw, (max-width: 767px) 92vw, 94vw" srcset="images/relaxing-on-workshops-2023-11-27-05-12-22-utc-1_1relaxing-on-workshops-2023-11-27-05-12-22-utc-1.webp 500w, images/relaxing-on-workshops-2023-11-27-05-12-22-utc-1_1relaxing-on-workshops-2023-11-27-05-12-22-utc-1.webp 800w, images/relaxing-on-workshops-2023-11-27-05-12-22-utc-1_1relaxing-on-workshops-2023-11-27-05-12-22-utc-1.webp 1080w, images/relaxing-on-workshops-2023-11-27-05-12-22-utc-1_1.webp 1920w" alt="People sleeping in a circle" class="image-full-width"></div>
                        <div id="w-node-_51899271-5376-bab9-28c6-15a90fc84320-f9c2c767" class="holder">
                            <h2 class="orange">Advaita</h2>
                            <p class="white">In weekendbijeenkomsten, residentieel of retraites eigentijds teksten en klassieke Advaita-teksten worden gebruikt als vehikel en hulp die altijd wijst naar wat je werkelijk bent, wat dat niet is je lichaam of geest, maar je tijdloze ware aard.</p>
                            <a href="wat-we-doen.html" class="button textual w-button">Lees meer<span class="button-arrow"> </span></a>
                        </div>
                    </div>
                </div>
                <div class="slide w-slide">
                    <div class="w-layout-grid grid-2cols">
                        <div id="w-node-_51899271-5376-bab9-28c6-15a90fc84329-f9c2c767" class="holder"><img src="images/meditating-during-session-2023-11-27-05-00-50-utc-1_1.webp" loading="lazy" sizes="(max-width: 479px) 94vw, (max-width: 767px) 92vw, 94vw" srcset="images/meditating-during-session-2023-11-27-05-00-50-utc-1_1meditating-during-session-2023-11-27-05-00-50-utc-1.webp 500w, images/meditating-during-session-2023-11-27-05-00-50-utc-1_1meditating-during-session-2023-11-27-05-00-50-utc-1.webp 800w, images/meditating-during-session-2023-11-27-05-00-50-utc-1_1meditating-during-session-2023-11-27-05-00-50-utc-1.webp 1080w, images/meditating-during-session-2023-11-27-05-00-50-utc-1_1.webp 1920w" alt="People meditating in a circle" class="image-full-width"></div>
                        <div id="w-node-_51899271-5376-bab9-28c6-15a90fc8432b-f9c2c767" class="holder">
                            <h2 class="orange">Nataraj</h2>
                            <p class="white">Een residentie of toevluchtsoord is als een snelkookpan en geweldig vuur waar alle illusoire ideeën worden verbrand, weggesneden en... verdampt. De hindoegod Nataraj symboliseerde dit mechanisme terwijl Shiva danst terwijl de vlammen wegbranden onwetendheid.</p>
                            <a href="wat-we-doen.html" class="button textual w-button">Lees meer<span class="button-arrow"> </span></a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="left-arrow w-slider-arrow-left"><img src="images/arrow-white-right_1.svg" loading="lazy" alt=""></div>
            <div class="right-arrow w-slider-arrow-right"><img src="images/arrow-white-right_1.svg" loading="lazy" alt=""></div>
            <div class="slide-nav w-slider-nav w-round"></div>
        </div>
    </div>
</section>
`

class Slider extends HTMLElement {
    constructor() {
        super();
    }

    connectedCallback() {
        const shadowRoot = this.attachShadow({ mode: 'open' });
        shadowRoot.appendChild(sliderTemplate.content);
    }
}
customElements.define('comp-slider', Slider);

How ever I can’t seem to get this to work no matter how much I research and play around with the code.

If possible a simple solution to load in the two javascript files so the slider functionality is restored.