JSFiddle - React, Tailwind, and code Playground

by kohei horiguchi

HTML

<div class="body">
    <div class="head">
        headA
    </div>
    <div class="contents">
        contentsB
    </div>
</div>
<div class="body">
    <div class="head">
        headB
    </div>
    <div class="contents">
        contentsC
    </div>
</div>
<div class="body">
    <div class="head">
        headC
    </div>
    <div class="contents">
        contentsD
    </div>
</div>

JavaScript

//各クラスに別々のイベントを紐付ける

jQuery(function(){
    jQuery(".head").each(function(e,v){
        jQuery(v).click(function(){
            alert('body'+e);
        });
    });
    jQuery(".contents").each(function(e,v){
        jQuery(v).click(function(){
            alert('contents'+e);
        });
    });
});