title: unexpected token error when using onclick
body: <p>this is my code </p>
  
  <pre><code>  const products = productArray.map(product =&gt;
  `
  &lt;tr&gt;
    &lt;td&gt;${product.id}&lt;/td&gt;
    &lt;td&gt;${product.type}&lt;/td&gt;
    &lt;td&gt;${product.price}&lt;/td&gt;
    &lt;td&gt;&lt;button onclick="${() =&gt; console.log('hello world')}"&gt;Examine&lt;/button&gt;&lt;/td&gt;
  &lt;/tr&gt;
  `
    );
    return tableBody.innerHTML = products.join('');
  </code></pre>
  
  <p>I just don't get why I'm getting this unexpected token error, that points to the html. I'm pretty sure It's a very stupid but I just cannot get where it is.
  <a href="https://i.stack.imgur.com/Th7ka.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Th7ka.png" alt="enter image description here"></a>
  <a href="https://i.stack.imgur.com/YKI71.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/YKI71.png" alt="enter image description here"></a></p>