JSFiddle - React, Tailwind, and code Playground

by Prasad

HTML

<div class='wrapper'>
<div class='class-first'>
    <ul>
        <li id='first-ul-li1'>first element</li>
        <li id='first-ul-li2'>second element</li>
        <li id='first-ul-li3'>third element</li>
    </ul>
</div>
<div class='class-second'>
    <ul>
        <li id='second-ul-li1'>first element</li>
        <li id='second-ul-li2'>second element</li>
        <li id='second-ul-li3'>third element</li>
    </ul>
</div>
<div class='class-third'>
    <ul>
        <li id='third-ul-li1'>first element</li>
        <li id='third-ul-li2'>second element</li>
        <li id='third-ul-li3'>third element</li>
    </ul>
</div>
</div>

JavaScript

$(document).ready(function(){
    $('.class-first ul li, .class-second ul li, .class-third ul li').on('click',function(){
        console.log("child :"+$(this).attr('id') + " Parent:"+$(this).parents().eq(1).attr('class'));
    });
})