1

function myFunction() {
    alert(document.getElementById("myP").style.color);
}
#myP {
  color: pink;
}
<!DOCTYPE html>
<html>
<body>

<p id="myP">This is an example paragraph.</p>

<button type="button" onclick="myFunction()">Return text color of p</button>




</body>
</html>

If I do 

<p id="myP" style="color: pink;">This is an example paragraph.</p>

It returns the color value correctly.

How can I get the color value if the value is set in css ?

I need Javascript not JQuery.

Thanks.

Patrick
  • 293
  • 1
  • 5
  • 14
  • 1
    [`window.getComputedStyle()`](https://developer.mozilla.org/en/docs/Web/API/Window/getComputedStyle) – nnnnnn May 18 '17 at 03:08
  • Where are you linking your css with the html file? It appears there is no link between the two. – dat3450 May 18 '17 at 03:12

1 Answers1

6

Try this code

var element = document.getElementById('myP'),
    style = window.getComputedStyle(element),
    color = style.getPropertyValue('color');
alert(color);

DEMO

Amal
  • 3,398
  • 1
  • 12
  • 20