Webpage lädt dauerhaft nach implementierung von JS

Hallo Zusammen

Ich bin seit einiger Zeit neu in das Programmieren mit JavaScript eingestiegen und stehe nun an meinem ersten Problem an:

Auf meiner Website habe ich ein Bild, welches ich auf Basis eines Textes, der aus der Datenbank ausgelesen wird ändere. (Bsp: Input-Text: Team 1 -> Bild wird zu Team_1.png gewechselt usw.)

Hierfür habe ich folgendes JavaScript geschrieben:

function loadLogo(img) {    var dynamic = document.getElementById("dynamicText").innerText;
    switch (dynamicText) {        case "Team 1": img.src = "img/team-logo/team_1.png";        break;
        case "Team 2": img.src = "img/team-logo/team_2.png";        break;
        default: img.src = "img/team-logo/logo_tbd.png";        break;    }}

Dieses JavaScript weise ich dem entsprechenden HTML-Element zu:

<img src="img/team-logo/logo_tbd.png" onload="loadLogo(this)"></img>

Nun zu meinem Problem:
Das JavaScript funktioniert eigentlich so wie ich möchte. Es vergleicht den Text und ändert das Bild entsprechend dem Text so wie es sollte.

Aber das Problem dabei ist, dass meine Webpage (in Chrome geöffnet) nach dem Laden des JavaScript's dauerhaft lädt (siehe Bild unten).

html-seminar.de/woltlab/attachment/2291/

Ich habe das Gefühl, dass das JavaScript dauerhaft dieses Abfrage macht und nicht stoppt, sofern eine Auswahl getroffen wurde. Bin aber nicht schlau geworden, was an meinem Code falsch ist, dass das die Abfrage nicht stoppt

Ich hoffe ihr könnt mir da weiterhelfen

Grüsse,

Andreas

Ich hab das mit JavaScript gemacht, weil es für mich, aus meiner Sicht, momentan die einzige Möglichkeit ist.

Vielen Dank für den Hinweis. Ich habe da wohl was falsch verstanden mit dem "onLoad" Event. Funktioniert nun nach kleiner Umschreibung der Funktion einwandfrei!

Gruss,

Andreas

Funktionsfähige Variante für Interessierte:

loadLogo();

function loadLogo() {    var text= document.getElementById("dynamicText").innerText;    var image = document.getElementById("dynamicLogo");

    switch (text) {        case "Team_1":        image.setAttribute("src", "img/team-logo/team_1.png");        break;

        case "Team_2":        image.setAttribute("src", "img/team-logo/team_2.png");        break;

        default:        image.setAttribute("src", "img/team-logo/team_tbd.png");        break;    }
}

<img id="dynamicLogo" src="img/team-logo/logo_tbd.png"></img>