href hashtag # makes modal popup gallery on click to jump on the top of the site

I am using an html5-css3 template with a modal popup gallery which jumps to the top of the site when I click on any image. It is because of the hashtag and I have no idea how to get it work properly. Please help! I am new to coding and I searched for an answer for days now but didn't find a solution.

here is how the html code looks like:

<a href="#" data-reveal-id="#modal-01"><img src="images/portfolio/canandreu.jpg" alt=""/></a>

If you add a class like modal-link to each of the a tags, then you can use some code like this:

var modalLinks = document.querySelectorAll('.modal-link');
Array.prototype.forEach.call(modalLinks, function(el, i){
  el.addEventListener('click', function(e){
    e.preventDefault();
  });
});

This will prevent each of the elements with the class modal-link from jumping you to the top of the page.