Mon get elementbyId ne marche pas

Bonjour,

je bloque sur un problème qui m'a l'air simple mais je n'arrive pas à récuperer mon élement par id.
Le but étant de faire un chronometre.
Mais d'après le débuggeur, le getelementbyId reste toujours null. Je ne comprends pas :?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!doctype html>
<html>
 
<head>
    <meta charset="utf-8">
    <title>Ma page web</title>
</head>
 
<body>
<script src="../js/chrono.js"></script>
 
</p>
    <p id="MonCompteur">0</p>
</body>
 
</html>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
var compteurElt = document.getElementById("MonCompteur");
 
 
//chronometre
function chronometre() {
    // Conversion en nombre du texte du compteur
    var compteur = Number(compteurElt.textContent);        
    compteurElt.textContent = compteur + 1;
}
 
// Appelle la fonction diminuerCompteur toutes les secondes (1000 millisecondes)
setInterval(chronometre, 1000);