JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
    
    <a href="#" class="child">
        <div class="subchild">i m subchild </div>
    </a>
    
</div>

CSS

.parent{
    background:green;
    padding:10px;
    margin-top:50px;
}
.child{
    position:relative;
    background:red;
    padding:10px;display:block;
    z-index:2;
}
.subchild{
    position:absolute;
    right:0;
    top:0;
    background:darkred;
    color:#fff;padding:10px;
    z-index:4;
}

JavaScript

//$('.parent').find('.child').css('z-index',parseInt($('.parent').css('z-index'))+1);


$('.parent').children().each(function(){
$(this).css('z-index',$('.parent').css('z-index')+1);
})