title: How to reload page after using fetch
body: <p>Was wondering why my code below isnt working. Basically I am fetch data from my url to delete something. on delete, it should refresh. however it doesnt seem to let me do that. But what it does is delete the post if i manually refresh the page.</p>
  <p>Works when I use Ajax method though which I don't know why.</p>
  <p>Fetch method</p>
  <pre class="lang-js prettyprint-override"><code>const deleteBTN = document.querySelectorAll('.deleteBtn');
  const update = document.querySelectorAll('.postedNote');
  
  console.log(deleteBTN);
  
  for (let btn of deleteBTN) {
      btn.addEventListener('click', (e) =&gt; {
          console.log(&quot;Delete from front end&quot;);
          console.log(btn[btn])
          let id = e.target.dataset.btn;
          fetch('http://localhost:3000/api/notes' + '/' + id, {
              method: &quot;DELETE&quot;,
          }).then(() =&gt; {
              Location: reload()
          })
      })
  }
  </code></pre>
  <p>Ajax method</p>
  <pre class="lang-js prettyprint-override"><code>$(&quot;.deleteBtn&quot;).click((e) =&gt; {
      $.ajax({
          type: &quot;DELETE&quot;,
          url: `http://localhost:3000/api/notes/${e.target.dataset.btn}`,
          success: function () {
              console.log(&quot;delete success&quot;);
          },
      }).done(
          setTimeout(() =&gt; {
              window.location.reload();
          }, 500)
      );
  });
  </code></pre>