Question

187

javascript color change not working

rated 0 times [ 193] [ 6] / answers: 1 / hits: 10064 / 10 Years ago, wed, march 5, 2014, 12:00:00

<!DOCTYPE html>

<html>

<body>



<h1>My First JavaScript</h1>



<p id=demo>

JavaScript can change the style of an HTML element.

</p>



<script>

function myFunction()

{ 

  x=document.getElementById(demo) 

  if (x.style.color=#000000)

  {

    x.style.color=#FF0000; 

    //alert(x.style.color);

  }

  else

  {

    x.style.color=#000000; 

    //alert(x.style.color);

  }

}

</script>



<button type=button onclick=myFunction()>Click Me!</button>



</body>

</html>

above code not working second time Click

i tried with many different colors

x.style.color not accepting in else block

else block not working

please help

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

rocioblancac

Add To Favorites

Follow

Total Points: 699

Total Questions: 96

Total Answers: 108

Location: Libya

Member since Mon, Dec 7, 2020

4 Years ago

rocioblancac questions

1 Angular: Error trying to diff '[object Object]'. Only arrays and iterables are allowed

Mon, Dec 13, 21, 00:00, 2 Years ago

1 Bootstrap multiple file selection - show only first file

Sun, Jul 26, 20, 00:00, 4 Years ago

1 React JS How to disable zoom

Wed, Jul 22, 20, 00:00, 4 Years ago

1 React Native https axios resquest gets Network Error on Android but not iOS

Thu, Jan 16, 20, 00:00, 4 Years ago

1 Color Input in React: The format is #rrggbb where rr, gg, bb are two-digit hexadecimal numbers

Mon, Jan 6, 20, 00:00, 4 Years ago

View All

answered 10 Years ago jamie · Accepted Answer

Different browsers might return different values for the same colors. You better use different logic to toggle the colors. What I suggest, using pure JavaScript, is this:

var demoColors = [#000000, #FF0000];

var demoFlag = true;

function myFunction()

{ 

    var demo = document.getElementById(demo);

    demo.style.color = demoColors[+demoFlag]

    demoFlag = !demoFlag;

}

Live test case.