JSFiddle - React, Tailwind, and code Playground

HTML

<h3 class="gray">SIZE:</h3>
<ol>
    <li>8.5" x 11"</li>
    <li>8.5" x 14"</li>
    <li>11" x 17"</li>
    <li>11.5" x 17.5"</li>
    <li>5.5" x 8.5"</li>
</ol>    
<h3 class="gray">PAPER OPTIONS:</h3>
<ol>
    <li>100# Gloss Text available</li>
    <li>95# Gloss Cover available</li>
    <li>80# Uncoated Offset Smooth Text</li>
    <li>100# Uncoated Cover available</li>
    <li>70# White Linen Text </li>
    <li>100# White Linen Cover</li>     
</ol>


<h3 class="gray">COATING OPTIONS:</h3>
<ol>
    <li>No Coating available on all stocks.</li>
</ol>

CSS

/* Make H3 look like a link. */
h3 {cursor: pointer;}
/* Hide all the OLs initially */
h3 + ol {display: none;}
/* Show when the user hovers H3 */
h32:active + ol {display: block;}
/* Or show when he clicks. Not sure if it works on H3 */
h3:target + ol {display: block;}