JSFiddle - React, Tailwind, and code Playground

HTML

<table>
<tbody>
<tr>
<td><a class="btn-slide"><img title="Тенты" alt="" src="http://ykkatent.ru/images/tent.png" /></a>
</td>
<td><a class="btn-slide2"><img title="Тенты для прицепов" alt="" src="http://ykkatent.ru/images/pricep.png" /></a>
</td>
</tr>
<tr>
<td><a class="btn-slide3"><img title="Автопологи" alt="" src="http://ykkatent.ru/images/avtopolog.png" /></a>
</td>
<td><a class="btn-slide4"><img title="Пологи" alt="" src="http://ykkatent.ru/images/pologis.png" /></a>
</td>
</tr>
<tr>
<td><a class="btn-slide5"><img title="Ангары" alt="" src="http://ykkatent.ru/images/angari.png" /></a>
</td>
<td><a class="btn-slide7"><img title="Чехлы" alt="" src="http://ykkatent.ru/images/lodki.png" /></a>
</td>
</tr>
</tbody>
</table>
<div id="panel">

Мы производим тенты для прицепов

</div>
<div id="panel2">


Мы производим пологи

</div>
<div id="panel3">И не только=)
</div>
<div id="panel4">

И не только=)
</div>
<div id="panel5">И не только=)
</div>
<div id="panel7">И не только=)
</div>

CSS

#panel,#panel2,#panel3,#panel4,#panel5,#panel6,#panel7 {
z-index:1000;
right: 20px;
top: 50px;
display: none;
padding: 5px;
width: 600px;
height: 700px;
background:#fff;
color: #666;
}
.btn-slide,.btn-slide2,.btn-slide3,.btn-slide4,.btn-slide5,.btn-slide6,.btn-slide7 {
background: #CCC;
color: #06F;
border: 5px;
border-color: #fff;
}
.active {
border: 5px;
background: #FF9;
border-color: #FF9;
}

JavaScript

$(function() {
			$(".btn-slide").click(function() {
				$("#panel").slideToggle("slow");
				$(this).toggleClass("active"); return false;
			});
		});
         
                $(function() {
			$(".btn-slide2").click(function() {
				$("#panel2").slideToggle("slow");
				$(this).toggleClass("active"); return false;
			});
		});
	    
                $(function() {
			$(".btn-slide3").click(function() {
				$("#panel3").slideToggle("slow");
				$(this).toggleClass("active"); return false;
			});
		});

                $(function() {
			$(".btn-slide4").click(function() {
				$("#panel4").slideToggle("slow");
				$(this).toggleClass("active"); return false;
			});
		});
	
                $(function() {
			$(".btn-slide5").click(function() {
				$("#panel5").slideToggle("slow");
				$(this).toggleClass("active"); return false;
			});
		});
	
                $(function() {
			$(".btn-slide6").click(function() {
				$("#panel6").slideToggle("slow");
				$(this).toggleClass("active"); return false;
			});
		});

                $(function() {
			$(".btn-slide7").click(function() {
				$("#panel7").slideToggle("slow");
				$(this).toggleClass("active"); return false;
			});
		});