title: Javascript/HTML5 - Store and display score in local storage
body: <p>I created a game with a score. Every time that there's a collision, it ads 10 points and when the user has made 16 collisions, the game ends, and the score gets stored in localstorage so it can be displayed on a scoreboard. </p>
  
  <pre><code>  //everytime there's a collision, contador++
    // when contador reaches 16, there's a pop up and the score is saved in local storage.
  
    if (contador == 16)  {
  
    localStorage.setItem("pontosSalvos", pontos);
  
    var pop = document.getElementById ( "alerta_ajuda");
    pop.style.display = 'inline';
    contador = 0;
  
            }
  </code></pre>
  
  <p>Then, there's a page for the scoreboard with the following code:</p>
  
  <pre><code>    //the score gets displayed on a span called mensagem
  
      function mostraPontos() {
      var pontos = localStorage.getItem ("pontosSalvos");
      var span = document.getElementById ("mensagem_pontos");
  
      span.innerHTML = pontos; 
  }
  </code></pre>
  
  <p>What I wanted to know is this:
  With the code like this, whenever there's a new score, it replaces the previous score in the scoreboard and it only shows the new score.
  Is there a way to store/display multiple scores without replacing the old ones?
  Thank you!</p>