title: Saving the html file's current state?
body: <p>So I am running some tests with JS and HTML right now, and one of the things I am doing is appending text to the page with JS every time the button is pressed. How do I keep the html the same after reloading the page? Is there a way to save it's current state so the added text doesn't go away? I'm sorry if this was answered before, I couldn't find any answers on this, nor do I know if it's possible. Thanks in advance!</p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt; &lt;HTML&gt; 
  &lt;HEADER&gt; 
  &lt;link rel="stylesheet" type="text/css" href="indexcss.css"&gt;
  
      &lt;center&gt; 
      &lt;b&gt; 
  &lt;TITLE&gt; &lt;/TITLE&gt; 
   &lt;div id='parentID'&gt; 
  
   &lt;/div&gt;
  &lt;script&gt; 
  prompt("prompting");
  
  var button = document.createElement("button");
  button.innerHTML = "Do Something"; 
  // 2. Append somewhere
  var body = document.getElementsByTagName("body")[0];
  body.appendChild(button);
  
  // 3. Add event handler
  button.addEventListener ("click", function() {
      var div = document.getElementById('parentID'); 
          div.innerHTML += 'Extra stuff';
  });
  &lt;/script&gt;
      &lt;h1&gt;
  
      &lt;/h1&gt;
      &lt;/b&gt; 
      &lt;/center&gt; 
  
      &lt;/HEADER&gt; 
  &lt;BODY&gt; 
  
  
  
  
  &lt;/BODY&gt;
  </code></pre>