Error with Promise fetch

Question

Guys I’m doing a beginner project with API,but arrives at a part I define a function but somehow error :

script.js:29 Uncaught (in promise) TypeError: Cannot read property 'querySelector' of undefined
    at criar (script.js:29)
    at script.js:10

the complete code :

let cont = document.querySelector(".sea");

function gerar (id , num ) {
    fetch(`http://api.football-data.org/v2/players/${id}/matches` , {
    "headers":  {
        "X-Auth-Token":"dc27d36b147a479bae295e494c925263"

    }
}).then( r => r.json()).then(r => criar(r,num));

}


function jogadores() {
    
    let primeiro = Math.round(Math.random() * 50)
    let segundo  = Math.round(Math.random() * 50)
    
    gerar (primeiro,1);
    gerar (segundo,2);
    
}



function criar(r,num) {

    let play = cont.document.querySelector(`.box${num}`)


        
}

jogadores()

Answer 1

Its variable cont is already an element, so you don’t need the .document.

You can use the .querySelector direct in the cont variable:

let play = cont.querySelector(`.box${num}`)