Answer 1

Write your js code in between
window.onload =() => {
// here
}

Answer 2

Reason why this is heppening is because you are trying to access element but this element dont exist jet.
In sololearn when you type your code in js tab, it is same as in head so it load before html elements, so elements are null, and you get error.

In sololearn you need to wrap code with window.onload = () => {
// your code
}
as Jayakrishna🇮🇳 said

In practice(when we code in editor) we connect external js by placing script tag at end of body tag.
Check my code to understand better how this works

https://code.sololearn.com/WPHmkG0Q5hCD/?ref=app