Вместо использования встроенного onclick используйте делегирование события . Это означает, что у вас есть один прослушиватель событий, который обрабатывает все события от детей и внуков. Модификация очень незначительна, см. Приведенный ниже пример.
Причина для этого заключается в том, что вы храните ваш JavaScript в вашем файле JS. Как и сейчас, вы сталкиваетесь с ошибкой JS и должны искать ее в своем HTML. Это может стать очень запутанным. Кроме того, встроенные onclick слушатели действительны, они устарели и их следует избегать, если нет абсолютно никакого другого пути. Сравните это с использованием !important в CSS, то же самое для этого.
function onCurrencyClick(event){
var val = $(this).val();
setCookie("booking_currency", val, 14);
}
currencyMap.on('click', '.currency-item', onCurrencyClick);
В этом примере берется val, который вы пытаетесь вставить из атрибута value из нажатой .current-item , <span> элементы не имеют такого атрибута, но <button> имеет и является гораздо более подходящим элементом, поскольку он ожидает взаимодействия с ним. Как правило, рекомендуется использовать интерактивные элементы для таких целей, как нажатие.
В приведенном ниже примере вы видите используемую кнопку и вывод значения abbreviation в атрибуте value элемента <button>, который можно прочитать из функции onCurrencyClick.
jQuery(document).ready(function($) {
$.getJSON('wp-content/themes/mundana/currency/currency.json', function(data) {
for(let c in data){
currencyMap.append(`
<button value="${data[c].abbreviation}" class="currency-item">
<span>
${data[c].symbol}
</span>
<span>
${data[c].currency}
</span>
</button>
`)
}
});