Audio works on preview but not published

Screenshot 2024-06-21 at 6.28.45 pm

I’ve created some code that enables me to play audio (via a button widget). While in preview mode, this audo works, and the published version works for me locally. But when I provide the published version to the client it doesn’t work (and it’s not because the client has the sound turned down!). We’ve tested the published version externally ourselves and found we also experience the same issue.

I’m perplexed by this not working when it does so brilliantly in preview. Is this a Readymag issue, or something else I should be aware of?

A truncated version of my site is here: Zoo News - Forum enq | Readymag
A screen grab of the button I’m using (to activate audio) for your reference, is above.
The code I’m using is at the bottom of this topic.

For context, the code I’m using references a widget data-ID and I’ve noticed that this data-ID does indeed change when making duplicates of the site and I’m wondering if widget data-IDs also change during other actions which may render my code ineffective. I’m not sure if I’m onto something here but I have noticed the data-IDs changing at certain times during production.

Ultimately, I’m just keen to have the audio working on the published version of the site.

  var audio = new Audio("");
function togglePlay() {
   return audio.paused ? : audio.pause();
$('div.common-button[data-id="667535c53ffdcb00141295fb"]').click( togglePlay );