Hey Everyone! I'd like to just outline some best practices I've ran into when doing basic dom manipulation in an obsidian block.

Why Would I Want to do That??

sometimes, you need to change text, add buttons, or other basic dom manipulation, and adding the pre/post HTML as pure HTML just doesn't cut it. For most things, I would HIGHLY recommend LAVA for most things. I only use Javascript when I need to.

Know the risks

When it comes to ways this can go wrong, it can break 3 ways:

  1. Not displaying - Preferred type of breaking
  2. Making the page unreadable - not preferred type of breaking
  3. Other - This is like a box of chocolates, you never know what you're going to get. Could be visual bugs, to just plane weird stuff
I'm going to list off the "types of breaks" and now you need to think in terms of a Not displaying error over a page unreadable error. The Not displaying error occurs when you are trying to hide, or show new buttons. Making the page unreadable is breaking the page by adding extra divs,  or close divs and if it breaks it can lead to completely changing the HTML.

Change your thinking - avoid the risks

First off, ONLY vanilla JavaScript. You'll get a type 2 or 3 error if the plugin gets old and you need to update it on your html block.

When it comes to Dom manipulation, you often are using CSS selector logic. But when it comes to this, I would guide you to be "as generically specific as you can."