JSFiddle - React, Tailwind, and code Playground

HTML

<div class="faq">
   <ul>
   <li><a href="#question1">Question 1</a>   
   <div id="question1">Answer 1 </div>
   </li>
   
   
   <li><a href="#question2">Question 2</a>
   <div id="question2">Answer 2 </div>
   </li>
   <li><a href="#question3">Question 3</a>
   <div id="question3">Answer 3 </div>
   </li>
   <li><a href="#question4">Question 4</a>
   <div id="question4">Answer 4 </div>
   </li>
   <li><a href="#question5">Question 5</a>
   <div id="question5">Answer 5 </div>
   </li>
   <li><a href="#question6">Question 6</a>
   <div id="question6">Answer 6 </div>
   </li>
   </ul>  
</div>

<div class='tat'>
<a class='k' href='#tat1'>q1</a>
<div id='q1' class='t'>eeee</div>
</div>

CSS

.faq ul li {
	display:block;
	float:left;
	padding:5px;
}

.faq ul li div {
	display:none;
}

.faq ul li div:target {
	display:block;
}

.tat .k {
	display:block;
	float:left;
	padding:50px;
}

.tat div {
	display:none;
}

.faq div:target {
	display:block;
}