JSFiddle - React, Tailwind, and code Playground
HTML
<div id="left_column">
<a href="#1" class="slick-slidetoggle">
Slide toggle the box</a><br />
<a href="#2" class="slick-slidetoggle">
Slide toggle the box</a>
</div>
<div id="right">
<div id="1" class="slickbox">Div 1</div>
<div id="2" class="slickbox">Div 2</div>
</div>
CSS
.slickbox {
background: #EEE;
border: 1px solid #900;
height: 135px;
display: none;
}
#left_column {float:left; width:200px;}
#right {width:200px;float:left;}
JavaScript
// hides the slickbox as soon as the DOM is ready (a little sooner that page load)
$('.slickbox').hide();
$('.slick-slidetoggle').click(function() {
$('.slickbox').show('slide', 400);
return false;
});