Please help me custom animation

[cybermyte]

hello i want to add animations onto my button so when the button is clicked it hides two things and shows one. i figured i can do this 3 different ways

1. display: none
2. animation move + masking
3. animation scale
4. animation opacity

i decided to use animation opacity and tried to grab info from other forums to help me write my code`:

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
 <script>
        window.addEventListener("load", () => {
            // Ensure jQuery is loaded

            // Define the button and iframe elements
            var button = $("[data-id='6647c5cb89fbf6002eb1d3f0']");
            var iframe1 = $("[data-id='6647cac6fe9b2c0035c61695']");
            var iframe2 = $("[data-id='6647cb089ff61c0044d5aa40']");

            var time = 300;

            // Add click event listener to the button
            button.on('click', function(){
                iframe1.stop(true, false).animate({"opacity": 0}, time);
                iframe2.stop(true, false).animate({"opacity": 0}, time);
            });

        });
    </script>

this is what i came up with and put it in my projects code i tried placing in the beginning of the body or the end but nothing is working although when i put this code in jsfiddle it works perfectly. i dont know whats inhibiting my code from working can someone please help me!!!

Image to hopefully better explain what im trying to do:

[neueMeta]

hey…

I noticed, that, the event listener “load” isnt firing inside RM… for what reason ever…
try to wrap your code inside a setTimeout of maybe 2 secs.

your code looks good though.