I'm reviewing my JavaScript and am having trouble figuring this out. Very simple problem to fix I'm sure. My function below will not read the background-color of my selected object.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<style>
#myDiv {
background-color: red;
width: 200px;
height: 200px;
}
</style>
</head>
<body>
<div id="myDiv">
<p id="hello">Hello</p>
</div>
<button id="btn">Click</button>
<script type="text/javascript">
var div = document.getElementById('myDiv');
var btn = document.getElementById('btn');
var hello = document.getElementById('hello');
btn.addEventListener('click', color);
function color() {
var div = document.getElementById('myDiv');
alert(div.style.backgroundColor);
}
</script>
</body>
</html>The alert that returns from this code is blank.
This looks very similar to this on the w3school site, but mine will not work.
https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_style_backgroundcolor4
Any help would be appreciated!
