title: Onclick for a Image inside an anchor tag is not working
body: <p><a href="https://i.stack.imgur.com/EI7Dd.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EI7Dd.png" alt="activity image"></a></p>
  
  <p>I have an image tag inside an anchor tag, the image tag has a greyed out star icon  which on click I want to change it to a golden colour star icon, so inside the image tag I have written a <code>onclick="myFunction('activity');"</code> which does this bit. </p>
  
  <pre><code>&lt;a href="/projects/test-project/activity" class="activity"&gt;
  &lt;img width="16" height="16" alt="grey star" src="/img/star.png" style="position:relative;left:180px;top:3px;z-index:100" onclick="myFunction('activity');" id="activity"&gt;
  Activity&lt;/a&gt;
  </code></pre>
  
  <p>But the problem is that when I click on the star icon image, the onlick function works but loads up url from the <code>href="/projects/test-project/activity"</code> from the anchor tag. How do I click on this image tag and make the page not get loaded?</p>
  
  <p>Thanks for any help</p>