The Pattern
Use a button to control the visibility of a content region.
<button type="button" aria-expanded="false" aria-controls="region1">
Show More info
</button>
<div id="region1" hidden>
<p>Additional details here...</p>
</div>
Interaction:
Toggle the aria-expanded attribute. The screen reader will announce "Show More Info, expanded" or "collapsed". Do not use links (href="#") for this behavior.