index.html


<!DOCTYPE html>
<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="icon" href="bulbs.png" />
    <title>Bulb ON/OFF </title>
    <link rel="stylesheet" href="bulb.css">
</head>
<body>
    <h1>Made by two coders Anjali and Prashant</h1>
    <button onclick="turnOn()">Turn On</button>
    <button onclick="turnOff()">Turn Off</button>
    <div class="bulb-container">
        <img id="bulb" src="OFFbulb.png" alt="" />
    </div>
    <script>
        const turnOn= () => {
    let imgOb = document.getElementById("bulb");
    imgOb.setAttribute("src", "ONbulb.png");
};
        const turnOff= () => {
    let imgOb = document.getElementById("bulb");
    imgOb.setAttribute("src", "OFFbulb.png");
};
if (srcValue == "OFFbulb.png") {
   turnOn();
}else{
    turnOff();
}
    </script>
</body>
</html>