Logical Operators

To make complex if statements, use logical operators. Example of checking if temperature is less than 60 and raining is true:
if (temperature < 60 && raining) {
  console.log(`it's cold and wet`)
}
Example of checking if temperature is less than 60 or raining is true:
if (temperature < 60 || raining) {
  console.log(`stay inside`)
}
Example of checking if temperature is more than 70 and raining is not true:
if (temperature > 70 && !raining) {
  console.log(`it's nice outside`)
}

Exercise 1 of 6

Write a condition to match the message.

HTML

<button id="andButton">Show message</button>
<p id="andParagraph"></p>

JavaScript

let andButton = document.getElementById(`andButton`)
let andParagraph = document.getElementById(`andParagraph`)

let rich = true
let famous = true

andButton.addEventListener(`click`, showAndMessage)

function showAndMessage() {
  if (// your code will appear here) {
    andParagraph.innerHTML = `I am rich and famous`
  }
}

Your code

Test your code

Exercise 2 of 6

Write a condition to match the message.

HTML

<button id="orButton">Show message</button>
<p id="orParagraph"></p>

JavaScript

let orButton = document.getElementById(`orButton`)
let orParagraph = document.getElementById(`orParagraph`)

let rich = false
let famous = true

orButton.addEventListener(`click`, showOrMessage)

function showOrMessage() {
  if (// your code will appear here) {
    orParagraph.innerHTML = `I am rich or famous`
  }
}

Your code

Test your code

Exercise 3 of 6

Write a condition to match the message.

HTML

<button id="notFamousButton">Show message</button>
<p id="notFamousParagraph"></p>

JavaScript

let notFamousButton = document.getElementById(`notFamousButton`)
let notFamousParagraph = document.getElementById(`notFamousParagraph`)

let rich = true
let famous = false

notFamousButton.addEventListener(`click`, showNotFamousMessage)

function showNotFamousMessage() {
  if (// your code will appear here) {
    notFamousParagraph.innerHTML = `I am rich, but not famous`
  }
}

Your code

Test your code

Exercise 4 of 6

Write a condition to match the message.

HTML

<button id="notRichButton">Show message</button>
<p id="notRichParagraph"></p>

JavaScript

let notRichButton = document.getElementById(`notRichButton`)
let notRichParagraph = document.getElementById(`notRichParagraph`)

let rich = false
let famous = true

notRichButton.addEventListener(`click`, showNotRichMessage)

function showNotRichMessage() {
  if (// your code will appear here) {
    notRichParagraph.innerHTML = `I am famous, but not rich`
  }
}

Your code

Test your code

Exercise 5 of 6

Write a condition to match the message.

HTML

<button id="neitherButton">Show message</button>
<p id="neitherParagraph"></p>

JavaScript

let neitherButton = document.getElementById(`neitherButton`)
let neitherParagraph = document.getElementById(`neitherParagraph`)

let rich = false
let famous = false

neitherButton.addEventListener(`click`, showNeitherMessage)

function showNeitherMessage() {
  if (// your code will appear here) {
    neitherParagraph.innerHTML = `I am neither rich nor famous`
  }
}

Your code

Test your code

Exercise 6 of 6

Write a condition to match the message.

HTML

<button id="eitherButton">Show message</button>
<p id="eitherParagraph"></p>

JavaScript

let eitherButton = document.getElementById(`eitherButton`)
let eitherParagraph = document.getElementById(`eitherParagraph`)

let rich = true
let famous = false

eitherButton.addEventListener(`click`, showEitherMessage)

function showEitherMessage() {
  if (// your code will appear here) {
    eitherParagraph.innerHTML = `I am either rich or famous, but not both`
  }
}

Your code

Test your code