Jquery click doesn't work after updating with AJAX

I have read some about my problem and still doesn't got the right answer.I tried .on method it still doesn't work.I am using Laravel.

   @foreach($orders as $order)
               <tr class="item">
                   <td></td>
                   <td></td>
                   <td></td>
                   <td><span id="paddingcustom"><span class="glyphicon glyphicon-minus cancelbox " data-menuid=""></span></span> </td>
                   <td></td>
               </tr>
  @endforeach

JS

   $('.cancelbox').each(function(){
    $(this).on('click',function(){
        $.ajax({
            type : 'POST',
            url  : 'menus/deleteTmp',
            data : {
                '_token' : $('input[name=_token]').val(),
                'id' : $(this).data('menuid'),
            },
            success : function ($data) {
                $('.item' + $data).remove();
            }
        });
    });

Everything I want work aftering loading the page but when I update the elements by using replaceWith() methods and onclick doesnt work.

I checked my updated html and attributes and they all are in the right place.

via Yan Myo Aung