[NOT YET Solved] e.stopImmediatePropagation(); e.stopPropagation(); is not working at a popup router

I have this structure below,

<a href="/popup/ticket/confirm/" class="link">
<div class="card">
<div class="card-content">
<div class="pin-heart">
<i class="fal fa-heart"></i>


and the ‘a’ tag is a router to open as a popup.

Then, I have this js code below too. cause’ I don’t want to open the popup when the ‘pin-heart’ tag is clicked.

$$(document).on(‘click’, ‘.pin-heart’, function(e) {
}, true);

but, still the popup is opened.

help me, plzzzzz.

what should I do?

As you define your click handler on ‘document’, the event is already propagated up the DOM. I think you should bind the handler directly on the .pin-heart element:

$$('.pin-heart').on(‘click’, function(e) {

@Tim, Thanks for your answer. but it still doesn’t work.