jquery при нажатии не работает при доставке через диспетчер тегов Google

Функция JQuery при нажатии не работает при доставке с помощью Диспетчера тегов Google.

Я рассмотрел эти проблемы, заключил свой код в готовый документ и использовал обновленный синтаксис .on ('click', function () {}), но он по-прежнему не работает.

Почему эта функция щелчка jQuery не работает?

jQuery onclick не запускается для динамически вставленных элементов HTML?

Диспетчер тегов Google: отслеживание событий не работает

Я пытаюсь добавить функцию jquery при нажатии для отправки данных в Google Analytics.

Когда кто-то нажимает на тег привязки с классом информации. Я использую jquery, чтобы перейти к его соседнему диапазону с классом рынков и получить его текстовое значение.

Поскольку существует несколько тегов привязки с одним и тем же классом, и мне нужно указать конкретное текстовое значение, я использую атрибут родительского тега li, чтобы найти правильный диапазон братьев и сестер.

Это HTML

<ul class="prices">
    <li class="message" style="display: none;">
        <div class="ajaxLoader"></div>
        <div class="errorLabel" style="display: none;">There are currently no markets available for your selection.</div>
    </li>

    <li key="MM4.uk.174619476" meetingkey="mm4.uk.meeting.4933626" class="show">
        <a href="#" class="info">Info</a>
        <span class="markets">Manchester City/Crystal Palace</span>
    </li>

    <li class="hide" key="MM4.uk.174619477" meetingkey="mm4.uk.meeting.4933626">
        <a href="#" class="info">Info</a>
        <span class="markets">Crystal Palace/Manchester City (h)</span>
    </li>

    <li key="MM4.uk.174619478" meetingkey="mm4.uk.meeting.4933626" class="show">
        <a href="#" class="info">Info</a>
        <span class="markets">Total Goals</span>
    </li>
    <li key="MM4.uk.174619482" meetingkey="mm4.uk.meeting.4933626" class="show">
        <a href="#" class="info">Info</a>
        <span class="markets">Corners</span>
    </li>

    <li key="MM4.uk.174619485" meetingkey="mm4.uk.meeting.4933626" class="show  last">
        <a href="#" class="info">Info</a>
        <span class="markets">Bookings</span>
    </li>

 </ul>

Вот код, который я использую для получения текстового значения диапазона.

На некоторых страницах атрибут тега li изменяется, поэтому используется тернарный оператор.

$(function() {
    $(".info").on("click",function(){
        console.log('this runs');
        var key = (($(this).parent().attr("key") != undefined) ? $(this).parent().attr("key") :$(this).parent().attr("meetingkey"));
        console.log(key);
        var text = (($("li[key='" + key + "'] .markets").text() != undefined) ? $("li[key='" + key + "'] .markets").text() : $("li[meetingkey='" + key + "'] a:eq(1)").text());
        console.log(text);
        var logStr = 'Info Button, Meetings page, ' + text;
        console.log(logStr);

    });
});

Этот код отлично работает, если я разверну его через консоль. Однако, когда я развертываю его как пользовательский тег HTML через Диспетчер тегов Google, он не работает, даже если код был добавлен на страницу.

Код, который отображается на странице после доставки через GTM.

    <script type="text/javascript" id="">
        $(function() {
            $(".info").on("click", function() {
                console.log("this runs");
                var a = void 0 != $(this).parent().attr("key") ? $(this).parent().attr("key") : $(this).parent().attr("meetingkey"),
                    a = void 0 != $("li[key\x3d'" + a + "'] .markets").text() ? $("li[key\x3d'" + a + "'] .markets").text() : $("li[meetingkey\x3d'" + a + "'] a:eq(1)").text();
                console.log("Info Button, Meetings page, " + a);
                ga("send", "event", "Info Button", "Meetings page", a)
            })
        });
    </script>

Обновлять:

Правило в GTM было активировано на всех страницах, я изменил его на событие, равное gtm.dom, и отладчик GTM утверждает, что тег запускается.

Одна вещь, которую я заметил в отладчике, - это то, что он делает некоторую странную подсветку синтаксиса в закрывающем теге скрипта. Выделение / script> 'оранжевым цветом. Я не могу понять, зачем ему это делать.

Почему прослушиватель onclick не работает при доставке через GTM?