как передать по клику значение из списка foreach в javascript

Из БД выгружается список эвентов и выводится он через foreach. Список отсортирован по дате, но id эвентов идут не по порядку, например 28, 11, 35, 19… В каждой строке эвента есть кнопка [ЗАПИСАТЬСЯ], при клике на которую из javascript происходит переход на страницу этого эвента. Весь этот наворот возник из-за создания на этой кнопке цели «JavaScript-событие» из яндекс-метрики.
Ни как не могу передать в скрипт id_event. Передаю его от сюда <input type="hidden" class="event<?=$id_event;?>". Как принять его тут let id_event = document.querySelector('.event').value;

    foreach ($rows as $value)
    { 
      $id_event = $value->id_event; ?>

      <form name="event_mk<?=$id_event;?>" action="" >
        <input type="hidden" class="event<?=$id_event;?>" value="<?= htmlspecialchars($id_event); ?>">
        <input type="button" class="btn" id="targetmk<?=$id_event;?>" onclick="ym(xxxxxx,'xxxxxx','xxxxxx'); return true;" name="targetmk" value="ЗАПИСАТЬСЯ" />
      </form> 
   `<?}?>`

<script type="text/javascript">
    let id_event = document.querySelector('.event').value;
    
    document.getElementById("targetmk" + id_event).onclick = function()
    {
        document.location.href = "/timetable-mk?record_mk=" + id_event;
    }
</script>