Захват данных в JS из сотен HTML-элементов с непредсказуемыми идентификаторами ⇐ Php

[Anonymous]

Я пытаюсь получить данные из элемента div в PHP для обработки во внешнем файле JavaScript.
В файле PHP у меня есть цикл while, который генерирует из БД , множество HTML-дивов (до 250 записей одновременно) с различными значениями из БД внутри них. Для каждого элемента div/записи есть кнопка, с помощью которой люди могут скопировать одно конкретное значение в буфер обмена.
Моя проблема в том, что я не могу выбрать значение по идентификатору, поскольку оно отличается и непредсказуемо. для каждого элемента.
Моделирование PHP для целей тестирования:

Код: Выделить всё

JavaScript в copy_value_to_clipboard_tester.js:

Код: Выделить всё

const button = document.querySelector("button");

button.addEventListener("click", copyToClipboard);
function copyToClipboard() {
window.focus() // Focus the window to make sure writing to the clipboard is allowed
navigator.clipboard.writeText(document.getElementById('copyValue').dataset.valuetocopy).then()
}

Проблема и причина, по которой я использую внешний JS-файл, заключается в том, что я не могу использовать встроенный JavaScript из-за Политики безопасности контента (CSP) на сайте, которая этого не делает. Разрешить любой встроенный JS. Это означает, что я не могу использовать onclick с уникальным значением, как обычно.
Как мне получить это значение $ из кнопки, на которую нажали, если потенциально есть сотни кнопок с непредсказуемыми идентификаторами на странице?

Подробнее здесь: https://stackoverflow.com/questions/781 ... ctable-ids