Este es un problema bastante simple que de alguna manera me está eludiendo, y mi google fu también me está fallando. Lo que espero que pase es que el valor cambie y se quede ahí. Pero por alguna razón, después de llamar a la función, regresa al let button = document.querySelector('#btn').addEventListener("click", ChangeText); línea. Y simplemente sobrescribe lo que acabo de hacer.
Soy plenamente consciente de que podría usar onclick en el botón, pero estamos destinados a usar eventlisteners para esto.
Aquí está el html y js. y un jsfiddle.
https://jsfiddle.net/bgd2n381/
let button = document.querySelector('#btn').addEventListener("click", ChangeText); function ChangeText() { let label = document.querySelector('#text'); if (label.innerText == "Start Text") { label.innerText = "Text has been changed"; } } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="js/uppgift2.js" defer></script> </head> <body> <form> <label id="text">Start Text</label> <br> <br> <br> <button id="btn">Button</button> </form> </body> </html>