I have been working on a little project to practice DOM manipulation - https://glitch.com/~toggle-password-visibility
There are two forms on the page with one or two password fields and a checkbox. My goal was to write a code that toggles visibility of the password fields depending on the state of the corresponding checkboxes.
I managed to write a working code, but when I started refactoring it, I noticed that it stops working when I move the loginForm and updatePassword form declarations outside of the event listener.
It works fine here on glitch only when I ‘unlink’ the external script.js file and move the code inside script tags at the bottom of the index.html.
I would like to understand why this happens.