Positionner windows.onload pour inclure plusieurs fonctions

Bonjour à tous,


Je cherche à ce que 4 fonctions soient actives dès le chargement de la page mais je ne sais où positionner le windows. J'ai essayé pas mal de choses, comme d'entourer tout cela d'un window.addEventListener ('load') mais le code ne fonctionne plus.
En l'état, seulement la dernière fonction est chargée au démarrage.
J'imagine que mettre un window.onload dans chacun des addEventListner n'est pas la solution...

(C'est pour des flèches de navigations horizontales dans une div overflow-x disparaissent lorsque le contenu arrive en butée)

Voici le code :

const cBoxAv = document.getElementById("concerts-box-av")
const cBoxPr = document.getElementById("concerts-box-pr")
const buttonLeftAv = document.getElementById('fleche-avg');
const buttonRightAv = document.getElementById('fleche-avd');
const buttonLeftPr = document.getElementById('fleche-prg');
const buttonRightPr = document.getElementById('fleche-prd')

cBoxAv.addEventListener("scroll", window.onload = function (){
    var XscrollAvg = cBoxAv.scrollLeft;
    if(XscrollAvg == 0) {
        buttonLeftAv.classList.add('hide')
    } else {
        buttonLeftAv.classList.remove('hide')
    }
})

cBoxPr.addEventListener("scroll", window.onload = function (){
    var XscrollPrg = cBoxPr.scrollLeft;
    if(XscrollPrg == 0) {
        buttonLeftPr.classList.add('hide')
    } else {
        buttonLeftPr.classList.remove('hide')
    }
})

cBoxAv.addEventListener("scroll", window.onload = function(){
    var XscrollAvd = cBoxAv.scrollLeft;
    var cBoxAvScrollWidth = cBoxAv.scrollWidth;
    var cBoxAvClientWidth = cBoxAv.clientWidth;
    var XscrollAvPercent = XscrollAvd / (cBoxAvScrollWidth - cBoxAvClientWidth);
    var XscrollAvPercentRound = Math.round (XscrollAvPercent * 100)

    if(XscrollAvPercentRound == 100) {
        buttonRightAv.classList.add('hide')
    } else if (cBoxAvClientWidth >= cBoxAvScrollWidth) {
        buttonRightAv.classList.add('hide')
    } else {
        buttonRightAv.classList.remove('hide')
    }
})

cBoxPr.addEventListener("scroll", window.onload = function(){
    var XscrollPrd = cBoxPr.scrollLeft;
    var cBoxPrScrollWidth = cBoxPr.scrollWidth;
    var cBoxPrClientWidth = cBoxPr.clientWidth;
    var XscrollPrPercent = XscrollPrd / (cBoxPrScrollWidth - cBoxPrClientWidth);
    var XscrollPrPercentRound = Math.round (XscrollPrPercent * 100)
    
    if(XscrollPrPercentRound == 100) {
        buttonRightPr.classList.add('hide')
    } else if (cBoxPrClientWidth >= cBoxPrScrollWidth) {
        buttonRightPr.classList.add('hide')
    }  else {
        buttonRightPr.classList.remove('hide')
    }
})

Merci beaucoup !!