Edvard D
Edvard D

Reputation: 101

How to add CSS code within if...else if...else Javascript statement

I'm trying to create an if...else if...else statement in Javascript that will change the style of a specific CSS ID based on a specific number. The if...else if...else code isn't the problem, it's just that as a Javascript novice (putting it lightly...) I'm not sure where to add the CSS code to execute it. From what I understand I would put it in the areas I designated as "CSS CODE" below (sorry for the poorly formated code).

if (Number == 9) {CSS CODE} else if (Number == 8) {CSS CODE}

I looked at another question here and the code that was provided to achieve this is below.

var element = document.getElementById("ElementID");  
element.style.backgroundColor = "#fff";

When I placed the var at the top and the element.style.etc within the CSS CODE section it did not work properly.

As a side note I need all the styling to be contained within the script, so adding a new class to it won't work. Along the same line of thought I can't use jQuery for any of this or I would have already :)

Upvotes: 3

Views: 4250

Answers (2)

Puzzle84
Puzzle84

Reputation: 540

var element = document.getElementById("ElementID");
var Number = 1;

switch(Number)
{
case 1:
  element.style.backgroundColor = "#fff";
  break;
case 2:
  element.style.backgroundColor = "#000";
  break;
default:
  element.style.backgroundColor = "#FAB";
  break;
}

Upvotes: 0

Hari Pachuveetil
Hari Pachuveetil

Reputation: 10374

This doesn't work?

    var element = document.getElementById("ElementID");
    var Number = 8;
    if (Number == 9) {
        element.style.backgroundColor = "#fff";
    } else if (Number == 8) {
        element.style.backgroundColor = "#000";
    }

Upvotes: 1

Related Questions