Uncaught TypeError: Cannot set property 'innerHTML' of null ERROR MSG

https://teamtreehouse.com/community/video:110227

I copy to what I proofread is verbatim off the video. I cannot shake the error msg of the title of this post.

When I retype my own scripts, I cannot get any printing of circled number into the main of the html page.

Here is my verbatim:

// HTML-LOOP Exercise const main = document.querySelector('main');

let html = '';

for ( let i = 5; i <= 100; i+=5 )  {
    html += `<div>${i}</div>`;
    main.innerHTML = html;
    console.log(html); 
}

Again it happens when the main.innerHTML = html is moved outside of the link.

I have also noticed that the videos are about 4-5 years old. In 2015, a new standard of JavaScript hit as reported by Tania Rasica from the followin link: https://www.digitalocean.com/community/tutorials/understanding-variables-scope-hoisting-in-javascript

ECMAScript 2015 (ES6) to be exact.

Like "OPTION EXPLICIT" in Visual Basic for Applications, my browswer seems to be in "JavaScript-Strict" mode. In this mode, it is NOT allowing declaring of local variables. Everything must be declared global.

=====================================

As the German Panzer Divisions bypassed stubborn strongpoints to be dealth with by the Werhmacht infrantry, so do I bypass this problem hoping for support to come solve this issue for me.

Also: has anyone else notices that Guil talks at about 10 words second...??? Or is it just me?