JSFiddle - React, Tailwind, and code Playground

HTML

<aside id="infos" class="infos">
						
								<h4 class="HowPlay">Taux de présence des cartes.</h4>
							
									<ul>
								
										<li>Ange Déchu Désir : 1x dans 88.8% des decks.</li>
										<li>Ange Déchu Ukobak : 1x dans 88% des decks.</li>
										<li>Cyclone Cosmique : 2x dans 65% des decks.</li>
										<li>Ange Déchu Tezcatlipoca : 1x dans 62% des decks.</li>
										<li>Ange Déchu Nasten : 3x dans 54% des decks.</li>
										<li>Ange Déchu &Eacute;toile du Matin : 1x dans 50% des decks.</li>
								
									</ul>
						
								<h4 class="HowPlay">Popularité des compétences</h4>
							
									<ul>
								
										<li>Un Lien puissant dans 50% des decks.</li>
										<li>Pioche de la Destinée dans 35% des decks.</li>
										<li>Compensation dans 12% des Decks.</li>
								
									</ul>
								
								<h4 class="HowPlay">Side Deck Possible</h4>
														
									<img src="Img/Side/sidedarklord.png" class="adjust" title="exemple de side">
					
									<p>Compétence de side : Armée Posthume</p>
								
							</aside>
						
						
						<p class="clear">Cliquer <span id="btn" class="btn" title="Définition">ici</span> pour des informations supplémentaires</p>

CSS

aside
{
float:right;
border:solid black 1px;
width:25%;
}
@media screen and (max-width: 1300px)
{
	.infos
	{
	display:none;
	}
}

.btn {
  text-decoration: underline;
}

JavaScript

var btn = document.getElementById('btn');
var infos = document.getElementById('infos');
btn.addEventListener('click', function(){
	infos.style.display = "block";
})