How to use a button in a sortable element (prevent sorting)

Hi there,

is it possible to prevent the moving behavior if i have a button inside a sortable element. Delete an element from the sortable list, with button inside the element.

Expected behavior

On click on a element inside a sortable Element, the sortable element, stays in place without start the "moving" behavior.

Actual behavior

Sortable element start the moving behavior, if clicked on a button inside the sortable Element.

Resources (screenshots, code snippets etc.)

<li class="list-group-item d-flex justify-content-between align-items-center sortable-item" draggable="true" data-mdb-id="sortable-item-335957" style="transform: translate3d(0px, 0px, 0px); transition: none 0s ease 0s;">
<div class="d-flex align-items-center">
    <div class="ms-3">
        <p class="fw-bold mb-1">
            Gemischter Salat
            <span class="badge rounded-pill badge-success">Active</span>
        </p>
        <p class="text-muted mb-0">
            Salat der Saison mit French Dressing
        </p>
    </div>
</div>
<i class="fas fa-trash-alt ms-auto pointer me-2 delete_content" data-content-id="26" aria-hidden="true"></i>
<i class="fas fa-exchange-alt grab fa-rotate-90" aria-hidden="true" ></i>

Click on the trash icon, start sortable moving, but i like it to stay in place and trigger a function that do some ajax stuff in background.

Is there any chance to do this?

I tried some ways to achieve this, disable sortable on click, but moving is already started. Thanks, Stefan.