JavaScript object not defined in a for loop

I have an object called quiz, and it is an object that is a collection of objects that have an ID, an array of IDs for the next elements, and a picture name stored as a string. the quiz object is accessible outside of the for loop in the code and in the first iteration, however, after in the second iteration, it gives me a quiz not found error, what is the issue? Here is my code:

function advance(id){
    var current = quiz[id];
    var next = current.next;
    for(x of next){
        let btn = document.createElement("BUTTON");
        btn.id = x;
        btn.addEventListener('click', () => advance(x));
        btn.innerHTML = quiz[x].picture;
        document.getElementById("foo").appendChild(btn);
    }
}