JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cparent">
foo1
<a href="javascript:void(0);" class="delete">Delete</a>
</div>

<div class="cparent">
foo2
<a href="javascript:void(0);" class="delete">Delete</a>
</div>

<div class="cparent">
foo3
<a href="javascript:void(0);" class="delete">Delete</a>
</div>

<div class="cparent">
foo4
<a href="javascript:void(0);" class="delete">Delete</a>
</div>
<br/>
<input type="text" value="foo1,foo2,foo3,foo4" id="result" />

SCSS

aaaaa

JavaScript

$(".delete").live("click",function(){
    
    var cur = $(".delete").index(this);
    var uploadedimg = $('#result').val();
    var ary_img = uploadedimg.split(',');
    var removed_img_array = ary_img.splice(cur,1);


   $("#result").val(ary_img);
    
   $(".cparent").eq(cur).html('Deleting...').delay(1000).fadeOut();
   
 //   $(".cparent",this).html('Deleting...').delay(1000).fadeOut();
 //not working  
 
    });