How to modify style to HTML elements (styled externally with CSS) using JS?

Question

so when i click on the

tag of the home class, i want it to change color to green but it doesn\'t work and idk why. the click registers fine (as the co

Answer 1

Do it like this:

function selectHome() {
  console.log("test");

  document.getElementsByClassName("home")[0].style.backgroundColor = "green";


}

.greyRect {
  height: 150px;
  width: 1350px;
  background-color: #D3D3D3;
}

h1 {
  text-align: center;
}

h2 {
  text-align: center;
}

.home {
  box-sizing: border-box;
  width: 80px;
  height: 35px;
  line-height: 2;
  position: relative;
  left: 350;
  color: white;
}

.casinocraps {
  background-color: grey;
  box-sizing: border-box;
  width: 120px;
  height: 35px;
  text-align: center;
  line-height: 2;
  position: relative;
  left: 460;
  bottom: 50;
  color: white;
}

.tictactoe {
  background-color: grey;
  box-sizing: border-box;
  width: 90px;
  height: 35px;
  text-align: center;
  line-height: 2;
  position: relative;
  left: 600;
  bottom: 100;
  color: white;
}

.bingo {
  background-color: grey;
  box-sizing: border-box;
  width: 80px;
  height: 35px;
  text-align: center;
  line-height: 2;
  position: relative;
  left: 700;
  bottom: 150;
  color: white;
}

.concentration {
  background-color: grey;
  box-sizing: border-box;
  width: 100px;
  height: 35px;
  text-align: center;
  line-height: 2;
  position: relative;
  left: 800;
  bottom: 200;
  color: white;
}

footer {
  text-align: center;
  line-height: 4;
  position: relative;
  top: 125;
  right: 15;
  height: 70px;
  width: 1365px;
  background-color: #D3D3D3;
}

.border {
  height: 50px;
  width: 100px;
  border: 4px solid green;
  background-color: #555;
  position: relative;
  top: 20;
  left: 100;
}

.rectangle {
  height: 50px;
  width: 100px;
  background-color: #555;
  position: relative;
  top: 50;
  left: 100;
}

  

  
  




  

    
Assignment 1

    
Home Page
    

      

        Home
      

  


    Casino Craps
  
  


    Tic-Tac-Toe
  
  


    Bingo
  
  


    Concentration
  
  
  

  
  
Footer