Now You See It, Now You Don’t: Two Ways To Toggle Using Vanilla JavaScript

Graham Flaspoehler
Nov 8 · 5 min read

In this tutorial, I walk through two methods you could use to change the content of a webpage by manipulating the Document-Object Model (“DOM”) in response to user click events.

Here’s what we’re looking to achieve:

  • On the load of a page, a user should see a button that says “Show Dog”
  • When the button is clicked, an ​<img>​ element should be toggled on and appear on the page. The text of the button should also toggle to “Hide Dog”

Keep the story going. Sign up for an extra free read.

You've completed your member preview for this month, but when you sign up for a free Medium account, you get one more story.
Already have an account? Sign in

Graham Flaspoehler

Written by

The Startup

Medium's largest active publication, followed by +542K people. Follow to join our community.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade