How can I select elements using classes on different elements with JavaScript?

Question

I want to select the Table like it is done at the moment. Unfortunately on another page i also have a table that should not be affected. At the moment i select by the class "mb-bhi-closed" which has to stay to only affect the active line in the table. But i would also like to before select to only to affect the footer with the elementor selector for footers "elementor-location-footer". How can i stack these? The current code is following:

$is_opened = MBHIPRO()->is_open('ThaiMama Horgen');

if($is_opened){
   add_action( 'wp_footer', 'custom_color_openingtimes_green' );
}

function custom_color_openingtimes_green(){
    ?>
          <script>
                 var simple = document.getElementsByClassName("mbhi-is-current");
                 for (i = 0; i < simple.length; i++) {
                   simple[i].style.color="green";
                 }
         </script>
<?php
    
}

Has somebody got an idea?

EDIT 1: The table I want to modify is always in the footer, yes. The one time it also appears NOT in the footer, i also DONT want it to be adjusted. So the "elementor-location-footer" class is in a div many parents above. Here you got a screenshot for visualization: https://screencast.com/t/59ZENnle4/ @isherwood: Thanks for the Input, as i'm new to active participation in StackOverflow.