JSFiddle - React, Tailwind, and code Playground

HTML

<!-- Содержимое левой колонки -->
<div class="left-menu" style="">
	<ul>
		<li class=""><a id="#block1" class="open_links" href="#">Первое</a></li>
		<li class=""><a id="#block2" class="open_links" href="#">Второе</a></li>
		<li class=""><a id="#block3" class="open_links" href="#">Третье</a></li>
	</ul>
</div>

<div id="block1" class="right-content display_body">
			ПервоеПервоеПервое<br>
			ПервоеПервоеПервоеПервое<br>
			ПервоеПервоеПервое<br>
			ПервоеПервое<br>
			ПервоеПервое<br>
</div>
<div id="block2" class="right-content display_body">
			второевтороевторое<br>
			второевторое<br>
			второевтороевторое<br>
			второевторое<br>
			второевторое<br>
</div>
<div id="block3" class="right-content display_body">
			третье<br>
			третьетретьетретье<br>
			третьетретьетретьетретье<br>
			третьетретьетретье<br>
			третьетретье<br>
</div>

CSS

div {border:1px solid #777;}
ul {padding:20px;}

.left-menu {
    float: left;
    clear: right;
    width: 25%;
    padding-right: 2%;
	padding-left:2%;
	padding-top:2%;
	padding-bottom:2%;
}
.right-content {
    clear: right;
    width: 76%;
    padding: 2%;
    padding-left:30%;
    min-width: 722px;
}
.open_links {cursor:pointer;}
.display_body {
	display:none;
	padding:20px;
 }

JavaScript

что здесь прописать, чтобы скрытый блок "right-content display_body" отображался (появлялся) при нажатии на ссылку "open_links" с присвоенным id - "block1", "block2", "block3" и т.д.?