Audio- 1 to be automatic; Audio- 2 on CR

On Windows 10 laptop, using Cloze cards.

I want audio- 1 to play automatically but keep audio- 2 hidden behind a clickable button. Audio is set to ‘Play automatically’. How do I alter the following code to do this?

'''''''

</>

 {{Audio- 1}}

 {{Audio- 2}}

{{type:cloze:Text}} {{cloze::Text}}

<br>><hr>> <br>

 <div style='font-family: "Arial"; font-size: 20px;'></div> {{Back- Extra}}<br> <br><br>

''''''

</>

I put your text in a code block, because some of it wasn’t being displayed. But you should check to make sure it is accurate to what is on your template.

If you only have a single audio file in the first audio field, just add the following script to the respective side of your card template:

<script>
document.querySelector(".soundLink").click();
</script>

It would work better if you disable audio autoplay in deck settings to avoid occasional double playback on card opening.

For a more elaborate solution, check out this thread:

Hi Danika_Dakika,
I’m not computer illiterate enough, I’m afraid to follow the detailed instructions you’ve suggested.
I added your ‘query_Selector’ suggestion without success.
If you could send me a version of my html with your suggestion included, it would be much appreciated.
To recap on the problem.
My html has the data in Back- Extra and I use HyperTTS to put one part in Audio- 1 field and some of the remainder into Audio- 2. BUT they both play when I reveal the answer in Back- Extra. How do I get Audio- 1 to play automatically and Audio- 2 to only play when I click on the audio icon?
Regards
Dave
My current html file is:-

{{Audio- 1}}

{{Audio- 2}}

{{type:cloze:Text}}

{{cloze::Text}}<br>><hr>>

<br>

<div style='font-family: "Arial"; font-size: 20px;'></div>

{{Back- Extra}}<br>

<br><br>