CODEWITHSUNDEEP
jqueryjquery-selectors
user1702965
user1702965

Reputation: 387

jQuery attribute selector not working

I'm setting up tracking in Google analytics for when someone clicks on a directions link, where the href would contains "maps.google.com...", so here's what I'm using:

        // track directions
        jQuery("a[href*='maps.google.com']").click(function(event) {
        console.log('directions link clicked');
        if (typeof gtag !== 'undefined') {
              gtag('event', 'Click', {
                'event_category': 'Contact',
                'event_label': 'Directions',
                'event_callback': function() {
                    console.log("directions tracking sent successfully");
                }

             });
        } // end if variable defined

Unfortunately, neither of those console.logs() are triggered.

The following works, however:

jQuery("a[href^='mailto']").click(function(event) {

});

Is this maybe because my directions link selector contains "."s ?

Upvotes: 0

Views: 64

Answers (1)

user1702965
user1702965

Reputation: 387

So for me it wasn't working because the element was created by a script (Google maps plugin for WordPress).

Here is my working solution:

// track directions
        jQuery('body').on("click",  "a[href*='maps.google.com']", function(event) {
        if (typeof gtag !== 'undefined') {
              gtag('event', 'Click', {
                'event_category': 'Contact',
                'event_label': 'Directions',
                'event_callback': function() {
                    console.log("directions tracking sent successfully");
                }

             });
        } // end if variable defined

        }); // end click function

Upvotes: 1

Related Questions