JSFiddle - React, Tailwind, and code Playground

HTML

<div id="yourOrderFoodsItems">
    <ul>
        <li>
            A
            <input type="button" value="Delete" class="deleteFood" />
        </li>
        <li>
            B
            <input type="button" value="Delete" class="deleteFood"/>
        </li>
        
        <li>
            C
            <input type="button" value="Delete" class="deleteFood"/>
        </li>
    </ul>
</div>

JavaScript

$("#yourOrderFoodsItems ul").on('click','.deleteFood',function(){
    $(this).closest('li').remove();
});