JSFiddle - React, Tailwind, and code Playground

HTML

<div class="item">
  Heading 1
  <span>Contents for item 1</span>
</div>
<div class="item">
  Heading 2
  <span>Contents for item 2</span>
</div>
<div class="item">
  Heading 3
  <span>Contents for item 3</span>
</div>

CSS

.item span {
  display: none;
}
.item.active span {
  display: block;
}

JavaScript

[].slice.call(document.querySelectorAll('.item')).forEach(function(el) {
	el.addEventListener('click', function() {this.classList.toggle('active')})
});