My page shall, when loaded, display Part 1 and Part 3 followed by button “Show Exercise”. Part 2 is hidden.
Clicking butten “Show Exercise” shall display Part 1 and Part 2 followed by button “Hide Exercise”. Part 3 is hidden.
Part 1 contains a sample text,
Part 2 contains some explanations relatad to the sample text, and
Part 3 contains an exercise related to the sample text.
How is the onclick to be scripted so that
display=”block” is changed to display=”none”, and
display=”none” is changed to display=”block”?
Thanks for your help.
…
<body>
<!– Part 1: a number of <p>s with text –>
<div class=”hidden” display=”none”>
<!– Part 2: a few <p>s and a <table> –>
<button type=”button” onclick=”???”>Show Exercise</button>
</div>
<div class=”shown”>
<!– Part 3: some <p>s with text –>
<button class= type=”button” display=”block” onclick=”???”>Hide Exercise</button>
</div>
</body>