jQuery Simple Example

HTML

<script src="//www.addressfinder.co.nz/assets/v2/widget.js"></script>
<div class="parent">
    Paizaum
    <div class="parent">
    
        <div class="filho">
            <div class="filhodefilho">filhodefilho</div>
            <div class="filhodefilho">filhodefilho</div>
            <div class="filhodefilho">filhodefilho</div>
            Filho 1
        </div>
        <div class="filho"><span>HAHAHAHAHHAHA</span>Filho 2</div>
        <div class="filho">Filho 3</div>
        <div class="filho">Filho 4</div>
    
    </div>
</div>
    
<div class="filhodefilho">
        FILHO DE FILHO
<div>
            
<div class="seila">
    <p>Nossa Muito legal</p>
</div>

CSS

body {
    padding: 5px;
}

.parent{ height: 200px; background:#F1F1F1;margin:3px;}
.filho{background:#CCC;}
span{background:#abeafe;}

JavaScript

$(document).ready(function(){
    
    $(".parent").on("click", function(e){
        $(this).css("color","GREEN");
        $(".filhodefilho",this).css("text-align","center");
        $(this).find(".filhodefilho:first").css("border","1px solid #000");
        $(this).find(".filhodefilho").css("background","#F3F3F3");
        $(this).closest(".parent").css("background","#FC5")
        ///-------------------------------------
        $(e.target).css("background","red");
        if($(e.target).is(".filho")){
             $(e.target).css("background","pink") ;  
        }
        
        //$(e.currentTarget).css("padding","20px");
    });
    

    
});