GTM Custom Javascript Undefined Variable

Viewed 698

I am working on a site with a mix of buttons and images/text labels wrapped in anchor tags, the anchor tags contain the href which I need to extract to Google Analytics via Google Tag Manager.

One Example

<a style="touch-action: manipulation; -ms-touch-action: manipulation; cursor: pointer;" href="/company_details/documents" id="ember11" class="ember-view">
        <i aria-hidden="true" class="material-icons message-icon">
          email
        </i>
        <span class="nav-masterhead-label">
          Letters
        </span>
      </a>

I have created a custom JavaScript variable but it results in undefined when the tag is triggered. The click Element can also be a button on the site so I created an if statement to allow for that, without the if statement the variable is undefined as well.

function (){
  var $clickElement = $({{Click Element}});
  if (typeof $clickElement.closest('a').href !== 'undefined'){
    return $clickElement.closest('a').href;
  } else {
    return $clickElement.href;
  }
}
1 Answers

A colleague at work Michael picked up my mistake that $({{Click Element}}) is undefined.

function (){
  var $clickElement = {{Click Element}};
  if (typeof $clickElement.closest('a').href !== 'undefined'){
    return $clickElement.closest('a').href;
  } else {
    return $clickElement.href;
  }
}
Related