JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td><input type="text" class="text1"></td>
        <td><input type="text" class="text2"></td>
        <td><input type="text" class="text3"></td>
        <td><button type="button" class="append_up">Up</button></td>
        <td><button type="button" class="append_down">Down</button></td>
    </tr>
    <tr>
        <td><input type="text" class="text1"></td>
        <td><input type="text" class="text2"></td>
        <td><input type="text" class="text3"></td>
        <td><button type="button" class="append_up">Up</button></td>
        <td><button type="button" class="append_down">Down</button></td>
    </tr>
    <tr>
        <td><input type="text" class="text1"></td>
        <td><input type="text" class="text2"></td>
        <td><input type="text" class="text3"></td>
        <td><button type="button" class="append_up">Up</button></td>
        <td><button type="button" class="append_down">Down</button></td>
    </tr>
</table>

JavaScript

$(document).ready(function(){
    var html = '<tr><td><input type="text" class="text1"></td><td><input type="text" class="text2"></td><td><input type="text" class="text3"></td><td><button type="button" class="append_up">Up</button></td><td><button type="button" class="append_down">Down</button></td></tr>';

    $('.append_up').click(function(e) {
        e.preventDefault();
        $(this).closest('tr').before(html);
    });

    $('.append_down').click(function(e) {
        e.preventDefault();
        $(this).closest('tr').after(html);
    });

});