JS DOM: Change CSS

By Xah Lee. Date: . Last updated: .

Press the following buttons to change the color.

Color Me

Code

<p>
 <span id="Jb3MX"><b>Color Me</b></span>
 <button id="button_red" type="button">RED</button>
 <button id="button_blue" type="button">BLUE</button>
</p>
{
 const Jb3MX = document.getElementById("Jb3MX");
 const button_red = document.getElementById("button_red");
 const button_blue = document.getElementById("button_blue");

 button_red.addEventListener("click", () => {
  Jb3MX.style.color = "red";
 });

 button_blue.addEventListener("click", () => {
  Jb3MX.style.color = "blue";
 });
}

This technique can be used to change the CSS value for any HTML element.