Idiomatic way to add IDs to elements or wrap them in a div with an ID?

[Smithx10]

Good Day All,

I am currently experimenting with attempting to add a "Copy" button to all fenced code blocks.

Is there already a pattern for this somewhere I can replicate?

My thought was to easily just mark all the fenced code blocks with an ID so I could easily identify those elements with the text I'd like to copy in the JS code. Perhaps this is incorrect, or misguided.

Suggestions on how to do this better are very much welcome.

Thank you,
Bruce Smith

[Smithx10]

Looking into this via https://www.dannyguo.com/blog/how-to-add-copy-to-clipboard-buttons-to-code-blocks-in-hugo/

It looks like document.querySelectorAll('pre > code') probably would match what we generate.... but still looking for input.

[yihui]

I happen to have done a minimal yet general implementation and written about it yesterday: https://yihui.org/en/2023/09/copy-button/