How to properly call a function in an event handler

const btn = document.querySelector('#__btn');
const text = document.querySelector('.content');
const source = 'scripts/callbacks.js';

btn.addEventListener('click', (loadScript) => {
    text.textContent = 'Loading another JS Script . . .';
    loadScript(source ,sayHello);

})


function loadScript (src, sayHello) {
    const script = document.createElement('script');
    script.src = src
    script.onload = sayHello;
    document.head.append(script);
    console.log('should be executed first followed by callback');
}

function sayHello() {
    console.log('Hello world !');
}

const btn = document.querySelector('#__btn');
const text = document.querySelector('.content');
const source = 'scripts/callbacks.js';

btn.addEventListener('click', (loadScript) => {
    text.textContent = 'Loading another JS Script . . .';
    loadScript(source ,sayHello);

})


function loadScript (src, sayHello) {
    const script = document.createElement('script');
    script.src = src
    script.onload = sayHello;
    document.head.append(script);
    console.log('should be executed first followed by callback');
}

function sayHello() {
    console.log('Hello world !');
}