The Keys to the Kingdom:

If you can get your head around everything on this page, then you're laughing!

Recall your first bit of JavaScript:

alert("you clicked me");

alert is known as a function.

The magic of JavaScript is that we can create our own functions.

<img src='cards/back.png' onClick='card_clicked(this);'>
<script>
  function card_clicked(image) {
    image.src='cards/13.png';
  }
</script>

And that is what I have done. card_clicked is my very own function - I could have called it anything I liked!

Recall this refers to the whole image element and that is what I have passed to my function.
I'm then able to change the picture. I chose the king of spades this time.

The script tags tell the browser to treat what is between them as JavaScript.
The layout doesn't matter but as our functions get more complex, this style of layout helps us humans!