JSFiddle - React, Tailwind, and code Playground
HTML
<div class="parent"><span class="clicky">Parent Text</span><br>
<h3 class="itemTitle">Click me!</h3>
</div>
<hr/>
<div class="parent"><span class="clicky">Parent Text</span><br>
<h3 class="itemTitle">Click me too!</h3>
</div>
CSS
.active { background: blue}
JavaScript
$(document).ready(function() {
$('.itemTitle').on('click', function() {
$(this).parent().addClass('active').siblings().removeClass('active');
});
/* $('.parent').on('click', function() {
$(this).removeClass('active');
}); */
$('.clicky').on('click', function() {
$(this).parent().removeClass('active');
});
});