Streaming live at 10am (PST)

Office hours text highlight

Hello,

I have a simple list (.section-opening-hours) containing opening hours and would like to highlight (bold, color change) a current day with JS. I am not familiar with this language and thus need a bit of an assistance.

Thank you in advance!


Here is my site Read-Only: [LINK]

hi @XcOxO here is a simple example how to

1 Like

Hi @Stan ,

thanks for your reply. I have also found the solution by implementing this code and creating the .OpeningDay class.

  1. Maybe are you able to convert this code to the one you have proposed? Looks much cleaner. Unfortunately, I am not so familiar with JS to do it by myself.

  2. What I have also noticed is that I needed to create a unique ID for each list item (monday1,monday2,etc.), otherwise it would not work. Is there some workaround for this?

weekday();

function weekday() {
    var d = new Date();

    if (d.getDay() == 0)     {
                        document.getElementById("Sunday").classList.add('OpeningDay');
                        }

    if (d.getDay() == 1)     {
                        document.getElementById("Monday").classList.add('OpeningDay');
                        }

    if (d.getDay() == 2)     {
                        document.getElementById("Tuesday").classList.add('OpeningDay');
                        }

    if (d.getDay() == 3)     {
                        document.getElementById("Wednesday").classList.add('OpeningDay');
                        }

    if (d.getDay() == 4)     {
                        document.getElementById("Thursday").classList.add('OpeningDay');
                        }

    if (d.getDay() == 5)     {
                        document.getElementById("Friday").classList.add('OpeningDay');
                        }

    if (d.getDay() == 6)     {
                        document.getElementById("Saturday").classList.add('OpeningDay');
                        }                   
                    }

Hi @XcOxO code I have provide does exactly what does snippet you have posted. My is just a bit cleaner. but feel free to use one that will suite you. I see that you are adding class So I will add this option to my example. After that is your call. :slight_smile:

Preji hezky den