0

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.

Florin Buffet
  • 3
  • 2
  • Thanks, but that information belongs in your question, not down here. – isherwood Feb 24 '22 at 19:56
  • Usually WP themes add the page name to the `body` class with a PHP function that can be leveraged for per-page CSS. Does your theme do this? Then you could use CSS to only target the page with the table to change – wouch Feb 24 '22 at 23:12
  • @wouch: it should be applied to the footer on all pages... Is there no way to just do cascading like in CSS? .footer .table? – Florin Buffet Feb 25 '22 at 08:44
  • Okay, then yes I would use `.elementor-location-footer table.mabel-bhi-businesshours` which should only target that table when in the footer – wouch Feb 25 '22 at 16:36
  • @wouch That was exactly my question, how do i apply a CSS selector like this in JS? – Florin Buffet Feb 25 '22 at 21:08
  • I recommend styling via CSS, but you can do it a few ways via JS. [This SO post](https://stackoverflow.com/questions/35630641/apply-css-dynamically-with-javascript) offers a few options that would work – wouch Feb 25 '22 at 21:23

0 Answers0