'Google Tag Manager Trigger - how to target children css selector

I've got a Google tag trigger setup correctly like, however it only fires when they click on the parent div. When they click on img or h6, it does not fire, is there a way I can change the GTM variable to allow for all child clicks as well?

[data-eventcategory="favourite-title"]

 <div data-eventcategory="favourite-title" data-eventaction="favourite" data-eventvalue="/title/8392/my-neighbor-totoro" class="css-kjroau" data-eventlabel="My Neighbor Totoro">
    <img class="MuiBox-root css-1xok4pd" alt="Add to watchlist" src="../../images/add.svg">
    <h6 class="MuiTypography-root MuiTypography-h6 css-1k4qb5n">Add to watchlist</h6>
</div>

enter image description here

htmlcssgoogle-tag-manager


Solution 1:[1]

Just do this:

[data-eventcategory="favourite-title"] *, [data-eventcategory="favourite-title"]

Also, using multiple attributes for analytics is a bad practice. It's best to use one attribute and concat all the logic in there. Easier to read, easier to parse, harder to make a mistake for devs and for new implementators.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 BNazaruk

Related Questions