JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    
    <div class="first">
	<input id="test1" name="accordion" type="checkbox" />
	<label for="test1">
<img src="http://designmodo.github.io/Flat-UI/images/icons/svg/toilet-paper.svg" class="hide1"><img src="http://designmodo.github.io/Flat-UI/images/icons/svg/mail.svg" class="hide2"></label>
    <article class="content">
        <p>Spring onion parsley squash lotus root gumbo swiss chard spinach amaranth scallion collard greens coriander brussels sprout caulie leek ricebean. Dandelion lotus root plantain mung bean spring onion radish soko fennel cucumber komatsuna. Shallot bell pepper broccoli welsh onion kohlrabi kale celery corn fava bean epazote.</p>
    </article>
	</div>
        
        
            <div class="first">
	<input id="test2" name="accordion" type="checkbox" />
	<label for="test2">
<img src="http://designmodo.github.io/Flat-UI/images/icons/svg/retina.svg" class="hide1"><img src="http://designmodo.github.io/Flat-UI/images/icons/svg/clocks.svg" class="hide2"></label>
    <article class="content">
        <p>Spring onion parsley squash lotus root gumbo swiss chard spinach amaranth scallion collard greens coriander brussels sprout caulie leek ricebean. Dandelion lotus root plantain mung bean spring onion radish soko fennel cucumber komatsuna. Shallot bell pepper broccoli welsh onion kohlrabi kale celery corn fava bean epazote.</p>
    </article>
	</div>
        
        
        </div>

CSS

.container{
	width: auto;
	height: auto;
	margin: 0 auto;
	font-family:Georgia;
	font-size: 1em;
	line-height: 1.5em;
	display: block;
    color: black;
}
.container label{
	position: relative;
	display: block;
	cursor: pointer;
	margin: 10px;
	float: none;
	width: auto;
}
.container input{
    position: absolute;
	visibility: hidden;
}
.container article{
	overflow: hidden;
	height: 0px;
	position: relative;
}
.container input:checked ~ article.content{
	height: auto; 
}
input[type='checkbox']:checked + label > .hide1 {
	display: none !important;
}
input[type='checkbox']:checked + label > .hide2 {
	display: block !important;
}
.hide2 {
	display: none !important;
}

JavaScript

$('#test1').change(function() {
    $('#test1:checked').parent().css('background-color', 'yellow');
});