Show/Hide collapsible text

[javascript7]

This code only works one to the page.

I want to use this for multiple block of text on the same page.

If there is a better way to do this I am open to that. I noticed there are way to also use JS for collapsible text.

Any help would be appreciated.

<style>
#cont {display: none; }
          .show:focus + .hide {display: inline; }
          .show:focus + .hide + #cont {display: block;}
</style>

<a href="#show"class="show">[Show]</a>
<a href="#hide"class="hide">[Hide]</a>
 <div id="cont">TEXT HERE</div>

[Ray.H]

@javascript7

I want to use this for multiple block of text on the same page.

If there is a better way to do this I am open to that.

Have a look at the The Details disclosure element

It works on it’s own without any styling, or you can customize it’s appearance and the disclosure triangle itself can also be customized.

Will be no problems using it repeatedly within the same page.

[javascript7]

Thank you, I like that! I appreciate the suggestion.