Time for action – moving around an HTML document
Perform the following steps to move from one element to another in JavaScript:
- We're going to keep working with the files we set up in the previous section. Open up the
scripts.js
file that's inside yourscripts
folder. Add a document ready statement, then write a new empty function calleddynamicFAQ
, as follows:$(document).ready(function(){ }); function dynamicFAQ() { // Our function will go here }
- Let's think through how we'd like this page to behave. We'd like to have all the answers to our questions hidden when the page is loaded. Then, when a user finds the question they're looking for, we'd like to show the associated answer when they click on the question.
This means the first thing we'll need to do is hide all the answers when the page loads. We can do this just like we did with the tab exercise in the Chapter 2, Enhancing Links. Get started by adding a class
jsOff
to the<body>...