JSFiddle - React, Tailwind, and code Playground
HTML
<style>
dl {
}
dt {
font-weight: bold;
position: relative;
bottom: -20px;
}
dd {
padding-top: 25px;
border-bottom:1px solid #000;
}
dd:not(.hide):nth-of-type(2n) {
background: #f5f5f5;
}
.hide {
display: none;
}
</style><dl class="terms">
<dt class="hide">A-P or a-p</dt>
<dd class="hide"><div class="container"><p>antero-posterior, from front to back</p></div></dd>
<dt class="hide">abdomen</dt>
<dd class="hide"><div class="container"><p>area of the body between chest and pelvis</p></div></dd>
<dt class="hide">abdominal</dt>
<dd class="hide"><div class="container"><p>pertaining to the abdomen</p></div></dd>
<dt class="hide">abduct, abduction</dt>
<dd class="hide"><div class="container"><p>movement of a body part away from the midline of the body</p></div></dd>
<dt class="hide">abducted gait</dt>
<dd class="hide"><div class="container"><p>walking with the legs spread away from the midline</p></div></dd>
<dt class="hide">abductor</dt>
<dd class="hide"><div class="container"><p>muscle that moves a body part away from the midline of the body</p></div></dd>
<dt class="hide">ability to walk</dt>
<dd class="hide"><div class="container"><p>walking, mobility, quality of life factor</p></div></dd>
<dt class="">ablatio mammae</dt>
<dd class=""><div class="container"><p>surgical removal of female breast</p></div></dd>
<dt class="hide">ablation</dt>
<dd class="hide"><div class="container"><p>surgical removal</p></div></dd>
<dt class="hide">above elbow (AE) amputation</dt>
<dd class="hide"><div class="container"><p>amputation through the humerus between the shoulder joint and the elbow joint</p></div></dd>
<dt class="hide">above elbow (AE) prosthesis</dt>
...