Using JS commands to toggle an element, but have it hidden at first

I want to use only JS commands to toggle an element in liveview, but I want it to be hidden at the start when it mounts and is loaded. Is there a way to do this while using JS.toggle/2 or do I have to add and remove a class explicitly?

toggle works by setting style="display: none;". If you want it hidden at first, the best way is to add that manually.

If you’re using Tailwind, you can use the newer toggle_class in which case add class="hidden" then toggle_class("hidden").

1 Like