JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id="arrow-slide1" class="arrow-slide"></span><span id="gallary-hide1" class="gallary-hide">[Best_Wordpress_Gallery id="2" gal_title="party"]</span><span id="arrow-slide1-up" class="arrow-slide arrow-slide-up"></span>

CSS

.gallary-hide {
		display:none;
	}
		.arrow-slide {
			background: #fff url("https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-arrow-up-b-128.png") no-repeat;
			display:block;
			width: 50px;
			height: 50px;
			margin: 0 auto;
		}
		.arrow-slide-up {
			background: #fff url("https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-arrow-down-b-128.png") no-repeat;
			display:none;
			width: 50px;
			height: 50px;
			margin: 0 auto;
		}

JavaScript

$('#arrow-slide1').click(function () {
		$('#gallary-hide1').toggle(200);
		$('#arrow-slide1').toggle();
		$('#arrow-slide1-up').toggle();
	});