I'm trying to dynamically replace links to imgur with embeds.

I go through the page and replace links with this:

<blockquote class="imgur-embed-pub" lang="en" data-id="a/XXXX"><a href="https://imgur.com/a/XXXX">https://imgur.com/a/XXXX</a></blockquote>

After all is changed I append this to the end of the body:

<script async src="//s.imgur.com/min/embed.js" charset="utf-8"></script>

First gallery gets replaced with proper embed without problem. But any subsequent galleries are left as-is. The link is wrapped with proper blockquote tag but the JS doesn't touch it.

I see this error in console:

Uncaught DOMException: Blocked a frame with origin "https://imgur.com" from accessing a cross-origin frame.
    at addFrame (https://imgur.com/a/XXXX/embed?pub=true&ref=https%3A%2F%2F2Flink%2F&w=540:656:31)
    at makeStub (https://imgur.com/a/XXXX/embed?pub=true&ref=https%3A%2F%2F2Flink%2F&w=540:744:17)
    at https://imgur.com/a/XXXX/embed?pub=true&ref=https%3A%2F%2F2Flink%2F&w=540:749:9
    at https://imgur.com/a/XXXX/embed?pub=true&ref=https%3A%2F%2Flink%2F&w=540:772:7

though based on the ID it actually is related to the one gallery that actually works.

If I try to change the order of galleries then it's the same, first one works, so it's not a problem with specific link.

Any ideas?