title: Replace DIV Element When Clicked On It 3 Times With Cookie Logging
body: <p>I am trying to make the replacement of div element once being clicked 3 times work with cookie logging. I want the webserver to remember when the element has been replaced once it was clicked 3 times. Maybe with a cookie? Neverless currently when, I refresh the page the element returns back to unchanged state like it was by default.</p>
  
  <p>I already coded a div element that changes id when being clicked on 3 times. It replaces with a different id but it doesn't cookies don't log it so after, I refresh the page it returns to default state, unreplaced.</p>
  
  <pre><code>function replaceAfter3Clicks(elem, newElem) {
      let count = 0;
      div1.addEventListener('click', () =&gt; {
          count ++;
          if (count === 3) {
              elem.parentNode.replaceChild(newElem, elem);
          }
      });
  }
  
  const div1 = document.querySelector('#id-1');
  
  // pre-made second div for future replacement
  const div2 = document.createElement('div');
  div2.id = 'id-2';
  div2.innerText = 'div 2';
  
  replaceAfter3Clicks(div1, div2);
  </code></pre>
  
  <pre><code>&lt;div id="id-1"&gt; div 1 &lt;/div&gt;
  </code></pre>