Chrome inspection comes up with Uncaught ReferenceError: detailsfade is not defined at HTMLButtonElement.onclick

Question

I was following this tutorial on You-Tube channel click Here begins in 6 minutes.

<script>
function detailsfaded(id){
    var data = {"id" : id};
    jQuery.ajax({
    url :'/php ecomerce site/includes/detailsfaded.php',
    method : "post",
    data : data,
    success: funtion(data){
    jQuery('body').append(data);
    jQuery('#details-modal').modal('toggle');
    },
    
    error: function(){
    alert("An error occured!");
    }
    });
}
</script>

        <button type="button" class="btn btn-sm btn-success" onclick="detailsfaded(<?php echo $product['id']; ?>)">Details</button>