title: TypeError: Cannot set property 'textContent' of null
body: <p>Currently having issues with this code for a while, and I keep getting errors no matter how much i check it out. </p>
  
  <p>The errors are all the same:</p>
  
  <p>TypeError: Cannot set property 'textContent' of null</p>
  
  <p>when i'm using querySelector or when i'm using getElementById as well. I don't know if it's my HTML or if i'm imputing it wrong. </p>
  
  <p>what i'm getting confused in is it works here... but the error pops up when i'm using my VSC (visual studio code) and running it on chrome, the error shows up. Is it my code or the VSC?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var dice = Math.floor(Math.random()* 6) +1;
  
  document.querySelector("#current-0").textContent = dice;</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="wrapper clear-fix"&gt;
      &lt;div class="player1-panel active"&gt;
          &lt;div class="player-name" id="player-1"&gt;Player 1&lt;/div&gt;
          &lt;div class="player-score" id="score-1"&gt;100&lt;/div&gt;
          &lt;div class="player-current-box"&gt;
              &lt;div class="player-current-label"&gt;Current&lt;/div&gt;
              &lt;div class="player-current-score" id="current-0"&gt;11&lt;/div&gt;
           &lt;/div&gt;
      &lt;/div&gt;
  
          &lt;div class="player2-panel"&gt;
              &lt;div class="player-name" id="player-2"&gt;Player 2&lt;/div&gt;
              &lt;div class="player-score" id="score-2"&gt;00&lt;/div&gt;
  
              &lt;div class="player-current-box"&gt;
                  &lt;div class="player-current-label"&gt;Current&lt;/div&gt;
                  &lt;div class="player-current-score" id="currentScore-2"&gt;00&lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;button class="btn-rules"&gt;&lt;i class="material-icons"&gt;
                  help&lt;/i&gt;Rules&lt;/button&gt;
          &lt;button class="btn-newGame"&gt;&lt;i class="material-icons"&gt;
                  add_circle_outline
              &lt;/i&gt;New Game&lt;/button&gt;
          &lt;button class="btn-rollDice"&gt;&lt;i class="material-icons"&gt;
                  autorenew&lt;/i&gt;Roll dice&lt;/button&gt;
          &lt;button class="btn-hold"&gt;&lt;i class="material-icons"&gt;
                  play_for_work&lt;/i&gt;Hold&lt;/button&gt;
  
          &lt;input type="text" placeholder="Goal" class="finalScore"&gt;
          &lt;img src="images/dice5.png" atl="dice" class="dice" id="dice1"&gt;
          &lt;img src="images/dice5.png" atl="dice" class="dice" id="dice2"&gt;
  
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>