JSFiddle - React, Tailwind, and code Playground

HTML

<div class="faq-block">
	<ul>
		<li class="question">
			
			<p><div class="plus"></div>Question 1</p>
			<p class="answer" style="display: none;">Answer 1</p>
		</li>
		<li class="question">
			
			<p><div class="plus"></div>Question 2</p>
			<p class="answer" style="display: none;">Answer 2</p>
		</li>
	</ul>
</div>

CSS

.faq-block ul, .faq-block ul li {
	list-style-type: none !important;
}
div.plus {
	display: block;
	width: 30px;
	height: 30px;
	background-color: red;
	float:left;
	margin-right: 20px;
	cursor:pointer;
}
div.minus {
	display: block;
	width: 30px;
	height: 30px;
	background-color: blue !important;
	float:left;
	margin-right: 20px;
	cursor:pointer;
}

JavaScript

$(".plus").on('click', function() { 
  $(this).toggleClass("minus plus")
  .closest('li').find(".answer").toggle();
});