Choor Door Project (Step 10 - Door is not opening!)


Hello there,

So currently I am working on the following project:

On step 10 it says the following:

  1. Next, within your door1 arrow function, change the src of doorImage1 to the value of botDoorPath .

Refresh the page. Now when you click on the door, watch as the closed door image changes to the ChoreBot ready to greet you with housework!


A variable’s src value can be assigned a new value held by another variable:

variableA.src = path;

Here is my current code:


<!DOCTYPE html>
    <title>Chore Door!</title>
    <link href="./style.css" rel="stylesheet" type="text/css">
    <link href="" rel="stylesheet" type="text/css">

    <div class="door-row">
      <img id="door1" src=""/>
    <script type="text/javascript" src="script.js"></script>


body {
  background-color: #222935;
  margin: 0px;

#door1 {
  cursor: pointer;


let doorImage1 = document.getElementById("door1");
door1.onlick = () => {
  doorImage1.src = botDoorPath;

const botDoorPath = "";

I just want to know why the door is not opening.

The next step involves adding more doors, but if it’s not opening now I’d like to figure out what went wrong.

Any help?


if i insert an alert within the onclick method:

door1.onlick = () => {
  alert("i get here");
  doorImage1.src = botDoorPath;

we get nothing, so the click event is not register. So something goes wrong in this line:

door1.onlick = () => {


Lol I realized it was such a silly mistake.

onlick > onclick

I’m facepalming at myself.

Thanks for the help!


And the reason i didn’t just tell you you had a typo, was because i hope you also see how i debugged and hopefully learned something from it