I was thinking of a different approach, maybe using tabs in JS.
I edited the snippet with your actual content so you can see how it is displayed. Reference here:
https://www.w3schools.com/howto/howto_js_tabs.asp
function openDef(evt, cityName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(cityName).style.display = "block";
evt.currentTarget.className += " active";
}.tab {
overflow: hidden;
border: 1px solid #ccc;
background-color: #f1f1f1;
}
.tab button {
background-color: inherit;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
font-size: 17px;
}
.tab button:hover {
background-color: #ddd;
}
.tab button.active {
background-color: #ccc;
}
.tabcontent {
display: none;
padding: 6px 12px;
border: 1px solid #ccc;
border-top: none;
}<div class="tab">
<button class="tablinks" onclick="openDef(event, 'Sighthounds')">Sighthounds</button>
<button class="tablinks" onclick="openDef(event, 'Origin')">Origin</button>
</div>
<div id="Sighthounds" class="tabcontent">
<h3>Sighthounds</h3>
<h3>The Sighthounds</h3>
<p>
By definition, a sighthound is simply a dog breed that hunts primarily by
sight and speed rather than by scent because of this they are sometimes
refered to as Gazehounds. Because sighthounds hunt by sight, they need to
have the speed and agility to keep up with their prey in order to keep
them in sight. Sighthound breeds typically have lean bodies, long legs,
and a flexible back – they also have deep chests to support their
unusually large hearts and lungs. To help you picture the typical
sighthound body, here is a list of breeds that are categorized as
sighthounds:
<h4>Afghan Hound:</h4>
<p>
Wow very biscit stop it fren very hand that feed shibe heckin, many
pats. Shooberino h*ck blep shoob sub woofer very taste wow shoober,
snoot heckin mlem smol borking doggo with a long snoot for pats. Heck
I am bekom fat pupperino borkdrive length boy, such treat maximum
borkdrive wow very biscit. Borking doggo clouds much ruin diet
pupperino tungg super chub, very hand that feed shibe you are doin me
a concern boofers
<span class="dots">...</span>
</div>
<div id="Origin" class="tabcontent">
<h3>Origin</h3>
<h5>Origin</h5>
<p>
Doggo ipsum smol borking doggo with a long snoot for pats bork mlem
heckin much ruin diet lotsa pats I am bekom fat, doing me a frighten most
angery pupper I have ever seen pats waggy wags vvv. big ol pupper big ol.
Ur givin me a spook smol borking doggo with a long snoot for pats big ol
pupper long bois ur givin me a spook bork smol adorable doggo, the
neighborhood pupper doing me a frighten puggorino tungg ur givin me a
spook. Blep the neighborhood pupper heckin good boys big ol pupper noodle
horse, doge big ol blep. noodle horse shibe maximum borkdrive. Bork you
are doing me a frighten boof pats, noodle horse extremely cuuuuuute you
are doing me the shock borkf, boof borkf.
</p>
<h4>Azwakah:</h4>
<p>
Wow very biscit stop it fren very hand that feed shibe heckin, many pats.
Shooberino h*ck blep shoob sub woofer very taste wow shoober, snoot
heckin mlem smol borking doggo with a long snoot for pats. Heck I am
bekom fat pupperino borkdrive length boy, such treat maximum borkdrive
wow very biscit. Borking doggo clouds much ruin diet pupperino tungg
super chub, very hand that feed shibe you are doin me a concern
boofers
<span class="dots">...</span>
</div>