If you need to style an element using Javascript then you can use the style object to support all your CSS needs.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13

<html>
  <body>

    <p id="p1">Hello World!</p>

    <script>
      document.getElementById("p1").style.color = "red";
    </script>

    <p>The paragraph above was changed by a script.</p>

  </body>
</html>

If you need to do this purely in a Javascript file itself, then:

1
2
3
4
5
6

// Get a reference to the element
var myElement = document.querySelector("#p1");

// Now you can update the CSS attributes
myElement.style.color = "red";
myElement.style.backgroundColor = "yellow";

Note that where CSS properties would use dashes to separate words, like background-color, Javascript instead uses camel casing and drops the space.

Example: background-color would become backgroundColor.