Outputting post content to jQuery .html() string

everyone.

I’m trying to create a tooltip that appears over a specific word (an a tag) inside a paragraph, inside a post content that’s being displayed on my page. I managed to add a class (“office”) to said paragraph from Gutenberg, which I’m using on the front end to target the anchor tag inside it and perform a jQuery .html() to add more content to that a tag (besides the text) which is the tooltip div. The contents of this tooltip div needs to be a specific post’s content. Please note that I don’t want to add the div in Gutenberg because I want to make this easy for the client too. Basically this is my code:

But when I run that, the console reports an error about syntax and I think this happens because when the function returns the content (with HTML tags) it creates line breaks for every HTML element, not to mention the <– wp:paragraph –> tags as well. So this messes up with the string to be read by .html().

How would you approach solving this problem, please?

Thanks in advance.