I have this code in my html:
<a href=“#” onclick=“document.getElementById (‘small’).className = document.getElementById (‘small’).className == ‘hidden’ ? ‘’ : ‘hidden’”>Small</a>
<a href=“#” onclick=“document.getElementById (‘medium’).className = document.getElementById (‘medium’).className == ‘hidden’ ? ‘’ : ‘hidden’”>Medium</a>
<a href=“#” onclick=“document.getElementById (‘large’).className = document.getElementById (‘large’).className == ‘hidden’ ? ‘’ : ‘hidden’”>Large</a>
</div></div>
<div id=“small”><div class=“txt”><textarea cols=“25” rows=“5”><a href=“http://justclubpenguin.com/”><img src=“http://justclubpenguin.com/widgets/banners/b1/160x.png” title=“Club Penguin” alt=“Club Penguin” /></textarea></div></div>
<div id=“medium”><div class=“txt”><textarea cols=“25” rows=“5”><a href=“http://justclubpenguin.com/”><img src=“http://justclubpenguin.com/widgets/banners/b1/180x.png” title=“Club Penguin” alt=“Club Penguin” /></textarea></div></div>
<div id=“large”><div class=“txt”><textarea cols=“25” rows=“5”><a href=“http://justclubpenguin.com/”><img src=“http://justclubpenguin.com/widgets/banners/b1/200x.png” title=“Club Penguin” alt=“Club Penguin” /></textarea></div></div>
Small, Medium, and Large are elements.
Here’s an example page: http://justclubpenguin.com/widgets/
How can I hide those elements upon page load, and have them open only when they are clicked?
Thanks