JSFiddle - React, Tailwind, and code Playground

HTML

<div class="tpl grey">Hosts:
    <p>Hi !</p>
    <p>How are you ?</p>
    <p>What ever.</p>
    <a href="./~">Oh !</a>
</div>

CSS

div, p, a { padding: 2em; border: 3px solid #666; }
p, a { background: #DDD; }

.grey { background: #BBB; }
.blue { border: 3px solid #6666FF; background: #CCCCFF; }

JavaScript

//Action to do on parent $(".tpl") 
var switch1 = function () {
    $(this).closest(".tpl").toggleClass("blue grey");
    console.log("Fired." );
}

// On() click event
$(document).ready(function() {
        $(".tpl").on("click", "p", switch1() );
});