Elemente mittels DOM löschen klappt einfach nicht!

[BodyLAB]

Guten Tag zusammen,

ich versuche schon die ganze Zeit Elemente mit Hilfe von DOM zu löschen. Die Elemente habe ich vorher mit DOM hinzugefügt und bekomme es einfach nicht hin das ich die Elemente nun wieder gelöscht bekomme. Worum es geht, ich versuche ein kleinen Vokabeltrainer zu bauen mit Hilfe von 10 Buttons (5 Deutsche und 5 Englische Wörter). Die Buttons erzeuge ich mit DOM und wenn man zurück auf Home klickt soll die Spielfläche gelöscht werden dafür möchte ich die Buttons wieder löschen. Leider ist alles was ich bis jetzt gemacht habe ein FEHLSCHLAG :-(

function deleteFild() {
    var elem = document.querySelectorAll('.wortschatzColumn');

    for (let i = 0; i < elem.length; i++) {
        var list = elem[i].childNodes;
        // while (list.length > 0) {
        //    list[0].remove();
        // }
    }

}

function erzeugeVokabelTrainerButtons() {
    erzeugeStapel();
    var container = document.getElementById('vokabelTrainerButtons');
    let wortschatzRow = document.createElement('div');
    let wortschatzColumn = document.createElement('div');
    let wortschatzColumn2 = document.createElement('div');

    wortschatzRow.setAttribute('class', 'wortschatzRow');
    wortschatzColumn.setAttribute('class', 'wortschatzColumn');
    wortschatzColumn2.setAttribute('class', 'wortschatzColumn');

    for (let i = 0; i < deutscherStapel.length; i++) {
        let anker = document.createElement('a');
        let anker2 = document.createElement('a');

        anker.setAttribute('class', 'wortschatzButton');
        anker.setAttribute('href', '#');
        anker2.setAttribute('class', 'wortschatzButton');
        anker2.setAttribute('href', '#');

        anker.innerHTML = englicherStapel[i]['text'];
        anker2.innerHTML = deutscherStapel[i]['text'];

        wortschatzColumn.append(anker);
        wortschatzColumn2.append(anker2);
    }

    wortschatzRow.append(wortschatzColumn);
    wortschatzRow.append(wortschatzColumn2);
    container.append(wortschatzRow);
}

vokabelTrainerStrat.addEventListener('click', erzeugeVokabelTrainerButtons);
document.getElementById('delete').addEventListener('click', deleteFild);

const englischVokabel = new Array('Hello', 'from', 'you', 'my', 'yes', 'meet', 'fine', 'not', 'bad', 'that');
const deutschVokabel = new Array('Hallo', 'von', 'du', 'mein', 'ja', 'kennenlernen', 'prima', 'nicht', 'schlecht', 'das');
stapelVokabel = new Array();
stapelIDs = new Array();
englicherStapel = new Array();
deutscherStapel = new Array();
let vokabelTrainerStrat = document.getElementById('vokabelTrainerStart');

function erzeugeStapel() {
    while (stapelVokabel.length / 2 < englischVokabel.length) {
        var zufallZahl = generateRandomInt(0, englischVokabel.length);
        if (!stapelIDs.includes(zufallZahl)) {
            stapelVokabel.push({ id: zufallZahl, text: englischVokabel[zufallZahl] });
            stapelVokabel.push({ id: zufallZahl, text: deutschVokabel[zufallZahl] });
        }
        stapelIDs.push(zufallZahl);
    }

    for (let i = 0; i < stapelVokabel.length / 2; i += 2)
        englicherStapel.push(stapelVokabel[i]);

    for (let i = 1; i < stapelVokabel.length / 2; i += 2)
        deutscherStapel.push(stapelVokabel[i]);

    shuffle(englicherStapel);
    shuffle(deutscherStapel);

}

function shuffle(a) {
    for (let i = a.length - 1; i > 0; i--) {
        const j = Math.floor(Math.random() * (i + 1));
        [a[i], a[j]] = [a[j], a[i]];
    }
    return a;
}

function generateRandomInt(min, max) {
    return Math.floor((Math.random() * (max - min)) + min);
}

 

[BodyLAB]

Gut das Löschen klappt.
Hab vergessen in der Methode in der ich die Arrays erschaffe für die verschiedenen Wörter diese zurück zusetzen. Somit sind die Arrays immer gewachsen und ich dachte es liegt am Löschen