Битрикс: AddHeadString после события

Есть кнопка в шаблоне компонента:

<button class="cookie-notification__accept"><?=GetMessage("COOKIE_NOTIFICATION_BUTTON")?></button>

На кнопку есть обработчик события по клику (в шаблоне компонента script.js):

cookieButtonAccept.addEventListener('click', () => {
    scripts();
}); 

Необходимо, чтобы функция scripts выполнила:

<?$APPLICATION->AddHeadString($arTemplateSettings["TEMPLATE_METRICA_CODE"]);?>

Как корректно оформить функцию scripts?

Если прописываю обработчик в шаблоне компонента:

<button class="cookie-notification__accept"><?=GetMessage("COOKIE_NOTIFICATION_BUTTON")?></button>
<script>
cookieButtonAccept.addEventListener('click', () => {
    localStorage.setItem('cookieDateAccept', Date.now());
    cookieNotification.classList.remove('show');
    scripts();
}); 

function scripts() {
    <?$APPLICATION->AddHeadString($arTemplateSettings["TEMPLATE_METRICA_CODE"]);?>
} 

То строка в хеад добавляется внезависимости от обработчика.