title: Retrieve previous position of an Image on refresh page
body: <p>So I'm making a Camel Race.
  Every time I hit a button the camel moves a few pixels to the right.
  But after refreshing the page, the camel goes back to it's origional position.</p>
  <p>Is there a way to retrieve the previous position of the camel?</p>
  <p>HTML</p>
  <pre><code>&lt;td id=&quot;button01&quot;&gt;&lt;button class=&quot;sale&quot; onClick=&quot;clickME()&quot;&gt;SALE!&lt;/button&gt;&lt;/td&gt;
  &lt;td class=&quot;counter&quot; style=&quot;font-size: 15; width: 1000;&quot;&gt;sales: &lt;a id=&quot;team1&quot;&gt;0&lt;/a&gt;&lt;/td&gt;
  
  and 
  
  &lt;th id=&quot;img01&quot;&gt;&lt;img class=&quot;camel1&quot; style=&quot;margin: -135 auto; width:150;&quot; src=&quot;camel1.gif&quot;&gt;&lt;/th&gt;
  </code></pre>
  <p>Script:</p>
  <pre><code>var camel1 = document.getElementById(&quot;img01&quot;);
  var link = document.getElementById(&quot;button01&quot;);
  link.addEventListener(&quot;click&quot;, move01);
  
  var camel1X = 0;
  function move01(e) {
     camel1X += 2;
     camel1.style.position = &quot;relative&quot;;
     camel1.style.transform = &quot;translateX(&quot; + camel1X + &quot;px)&quot;;
     e.preventDefault();     //prevents the page from redirecting
  }
  
   var team1 = 0;
      function clickME() {
          team1 += 1;
          document.getElementById(&quot;team1&quot;).innerHTML = team1;
   }
   
  </code></pre>
  <p>Script says:</p>
  <p>On click: button01, img01 moves 2 pixels to the right and the counter adds +1.</p>
  <p>I tried to make it as clear as possible.</p>
  <p>Thanks in advance.</p>
  <p>Roel</p>