JSFiddle - React, Tailwind, and code Playground

HTML

<a href="www.google.com" class="link1">
    <div class="logo">
    </div>
  </a>

  <a href="#" class="link2">
    <div class="info1">Info 1</div>
    <div class="info2">Info 2</div>
  </a>

CSS

.logo{
  width: 100px;
  height: 100px;
  background-color: blue;
}

JavaScript

if (document.addEventListener) {
        document.addEventListener(`click`, interceptClickEvent);
} else if (document.attachEvent) {
        document.attachEvent(`onclick`, interceptClickEvent);
}

$(document).ready(function(){
	$(`.link2`).click(function(event){
  	event.stopPropagation();
  });
});

function interceptClickEvent(event) {
    let target = event.target || event.srcElement;
    let $target = $(target);
		console.log($target);
    console.log(`intercept click event called with closest a: `);
    console.log($target.closest(`a`));
    
    if ($target.closest(`a`).length > 0) {
        event.preventDefault();
        event.stopPropagation();
        console.log(`there's a link`);
    }
}