Custom Javascript for reusable content

We are trying to use the custom javascript for our site to hack in some reusable content blocks - theoretically creating a new element that we can add in html content blocks to add the same content to multiple pages.

However, the elements don't appear to be added correctly - they don't extend within the pages.

Here is the javascript we are trying to add in the Appearance "Custom Javascript" section - am I missing something to make this actually apply to the site script?

customElements.define('beta-flag', betaFlag);

// Re-useable content to beta-flag
class betaFlag extends HTMLElement {
connectedCallback() {
this.innerHTML = <blockquote class="callout callout_warn" theme="🚧"><h3 class="callout-heading"><span class="callout-icon">🚧</span><p>Beta Feature</p></h3><p>This feature is available through the Beta program only and is not released for general availability. If you would like to request access to the Beta program, please contact your Account Manager.</p></blockquote>;
}
}