Exercise Set 1

Exercise 1 of 6

Add a click event listener to the button. If you're having trouble, rewatch the event listener video.

HTML

<button id="greetingButton">Say greeting</button>
<p id="greetingParagraph"></p>

JavaScript

let greetingButton = document.getElementById(`greetingButton`)
let greetingParagraph = document.getElementById(`greetingParagraph`)

// your code will appear here

function sayGreeting() {
  greetingParagraph.innerHTML = `Welcome to exercise set 1`
}

You must be signed in to type your code.

Exercise 2 of 6

Add a click event listener to the button.

HTML

<button id="jokeButton">Tell joke</button>
<p id="jokeParagraph"></p>

JavaScript

let jokeButton = document.getElementById(`jokeButton`)
let jokeParagraph = document.getElementById(`jokeParagraph`)

// your code will appear here

function tellJoke() {
  jokeParagraph.innerHTML = `What do you call 2000 mockingbirds?`
}

You must be signed in to type your code.

Exercise 3 of 6

Add a click event listener to the button.

HTML

<button id="answerButton">Show answer</button>
<p id="answerParagraph"></p>

JavaScript

let answerButton = document.getElementById(`answerButton`)
let answerParagraph = document.getElementById(`answerParagraph`)

// your code will appear here

function showAnswer() {
  answerParagraph.innerHTML = `Two kilo mockingbird`
}

You must be signed in to type your code.

Exercise 4 of 6

Show your name when the button is clicked. If you're having trouble, rewatch the output video.

HTML

<button id="nameButton">Show name</button>
<p id="nameParagraph"></p>

JavaScript

let nameButton = document.getElementById(`nameButton`)
let nameParagraph = document.getElementById(`nameParagraph`)

nameButton.addEventListener(`click`, showName)

function showName() {
  // your code will appear here
}

You must be signed in to type your code.

Exercise 5 of 6

Show your age when the button is clicked.

HTML

<button id="ageButton">Show age</button>
<p id="ageParagraph"></p>

JavaScript

let ageButton = document.getElementById(`ageButton`)
let ageParagraph = document.getElementById(`ageParagraph`)

ageButton.addEventListener(`click`, showAge)

function showAge() {
  // your code will appear here
}

You must be signed in to type your code.

Exercise 6 of 6

Show a message when the button is clicked.

HTML

<button id="messageButton">Show message</button>
<p id="messageDisplay"></p>

JavaScript

let messageButton = document.getElementById(`messageButton`)
let messageDisplay = document.getElementById(`messageDisplay`)

messageButton.addEventListener(`click`, displayMessage)

function displayMessage() {
  // your code will appear here
}

You must be signed in to type your code.

Last section Next section