CSS transition not triggering on dynamically added class in Bootstrap 5 modal
I just started working with I'm updating my dependencies and I'm optimizing some code but I'm stuck on something that should probably be simple... I'm working with an scenario where a CSS transition is not triggering correctly when I dynamically add a class to a Bootstrap 5 modal. I want to apply a fade-in effect when the modal appears, but it seems that the transition isn't firing as expected. Here’s what I have: First, I have this basic HTML structure for the modal: ```html <div class="modal fade" id="myModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalLabel">Modal title</h5> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> </div> <div class="modal-body"> Modal body content. </div> </div> </div> </div> ``` I'm using the following CSS to add a fade effect: ```css .fade-in { opacity: 0; transition: opacity 0.5s ease-in; } .fade-in.show { opacity: 1; } ``` In my JavaScript, I’m using jQuery to show the modal and add the `fade-in` class: ```javascript $('#myModal').on('show.bs.modal', function (e) { $(this).addClass('fade-in'); }); ``` The question is that when the modal opens, the fade-in effect does not occur. The modal just appears instantly without the transition. I've tried moving the class addition to different modal events like `shown.bs.modal`, but that didn't work either. Also, the Bootstrap default `fade` class seems to conflict with my custom transition. I’ve checked the console for any errors, but it’s clear. Is there a recommended way to ensure my custom transition works alongside Bootstrap's modal functionality, or is there a better approach to achieve this effect? Any insights would be appreciated! How would you solve this? I'm working in a Ubuntu 22.04 environment. Thanks for any help you can provide! I'm working with Javascript in a Docker container on CentOS. Any help would be greatly appreciated!