Changing colour

HTML-CSS
1

I wrote a function that was supposed to change colour of a div according to the value of paragraph that is inside it but it doesn’t work for some reason any suggestions?

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <title>Document</title>
</head>
<body>
   <div id="poo"> <p id="po">0</p></div>
    <div id="piss"><p id="pis">15</p></div>
    <div id="psll"><p id="psl">30</p></div>
    <button onclick="checkMissing()">12121</button>

    <script>
        function checkMissing () {
            let a = document.getElementById('po').value;
            let b = document.getElementById('pis').value;
            let c = document.getElementById('psl').value;
            let d = document.getElementById('poo');
            let e = document.getElementById('piss');
            let f = document.getElementById('psll');
            if (a == 0) {
               return d.bgColor = "red";
            } else if (a <= 5 ) {
               return d.bgColor = "yellow";
            } else {
               return d.bgColor = "Honeydew";
            }
            

        }
        function updateee() {

        }
    </script>
    
</body>
</html>
2

What do you mean by doesn’t work? What is the colour supposed to be for a specic value in the paragraph? Give us an example of exactly what you expect to see.

FYI - div elements do not have value properties. They have innerHTML, innerText, and textContent properties.

d is an element and elements do not have bgColor properties.

Based on what you have tried so far, I suggest you go through some of our CSS curriculum challenges to get a better understanding of how to style elements.