JSFiddle - React, Tailwind, and code Playground

HTML

<h1>rows</h1>
<div class="rows row1">
    <div class="ele">1</div>
    <div class="ele">1</div>
    <div class="ele">1</div>
</div>

<div class="rows row2">
    <div class="ele">2</div>
    <div class="ele">2</div>
    <div class="ele">2</div>
</div>

CSS

.rows { float:left; width:390px; }
.ele { 
    display:block; float:left; width:100px; height:100; margin:10px; color:#fff;
    text-align:center; background-color:#000;
}

JavaScript

$('.ele').click(function() {
    
    if ( $(this).parent().hasClass('r1') ) {//way1
        alert('you clicked 1st row element');
    }
    
    else if ( $(this).parent('.r2') === true ) { //both way wont work
        alert('you clicked 2nd row element');
    }
    
});