JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
<table class="table table-hover table-striped">
    <thead>
        <tr>
            <th></th>
            <th>Left context</th>
            <th>Right context</th>
            <th class="text-center">Delete row?</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
        </tr>
        <tr>
            <td>2</td>
        </tr>
        <tr>
            <td>3</td>
        </tr>
        <tr>
            <td>4</td>
        </tr>
        <tr>
            <td>5</td>
        </tr>
        <tr>
            <td>6</td>
        </tr>
    </tbody>
    <tbody class="sortable">
        <tr class="ui-state-default">
            <td>
                <input type="text" class="form-control left-context" value="">
            </td>
            <td>
                <input type="text" class="form-control right-context" value="">
            </td>
            <td>
                <button type="button" class="btn btn-danger remove-row"><i class="fa fa-trash-o"></i>
                </button>
            </td>
        </tr>
        <tr class="ui-state-default">
            <td>
                <input type="text" class="form-control left-context" value="">
            </td>
            <td>
                <input type="text" class="form-control right-context" value="">
            </td>
            <td>
                <button type="button" class="btn btn-danger remove-row"><i class="fa fa-trash-o"></i>
                </button>
            </td>
        </tr>
        <tr class="ui-state-default">
            <td>
                <input type="text" class="form-control left-context" value="">
            </td>
            <td>
                <input type="text" class="form-control right-context" value="">
            </td>
            <td>
                <button type="button"...

CSS

td {
    padding: 8px;
}

JavaScript

$(function () {
    $(".sortable").sortable();
    $(".remove-row").on("click", function () {
        $(this).closest("tr").fadeOut(300);
    });
});