I am new to coding and working on a javascript project. I am trying to setup a change in “class” attribute (change of background color) in a textarea. The change should happen according to time of day which I am accessing via moment.js. This is a 9am to 5pm scheduler in which each hour block should change background color depending if it is past-time, present-time or in the future. I try to do it with a switch statement but I think my syntax is not what it should be. This is the code I am using:

var correctTime = moment().hour();
var time17 = 17
var time18 = 18;

    switch(time17) {
    case correctTime > time17:
        switchClass("box5").addClass("past");
        break;

    case correctTime >= time17 && correctTime < time18:
        switchClass("box5").addClass("present");
        break;

    case correctTime < time17:
        switchClass("box5").addClass("future");
        break;  
        default: 
    }

This are the classes in the css file:

  .past {
    background-color: #d3d3d3;
    color: white;
    font-size: 30px;
    text-shadow: black 2px 2px;
  }

  .present {
    background-color: #ff6961;
    color: white;
    font-size: 30px;
    text-shadow: black 2px 2px;
  }

  .future {
    background-color: #77dd77;
    color: white;
    font-size: 30px;
    text-shadow: black 2px 2px;
  }

This is the portion of the HTML:

<div class="row" id="5pm">
   <div class="col-md-2"><h3 id="5pmTime" class="timeOfDay">5:00pm</h3></div>

   <div class="col-md-8" id="textbox-5"><Textarea class="text-box" id="box5" value=".    </Textarea></div>       

   <div class="col-md-2"><button class="saveBtn" class="save-box" id="save5pm"><img    src="assets/savebutton.png" height="45px"></button></div>
</div>