jquery sort rows and values

Based in this ex. http://jsfiddle.net/vaDkF/160/ how can change input values to increase or decrease value when click on UP or DOWN mantaining order (1.2.3.4...) of values? Also how can add 开发者_Go百科another button to remove row?

$(document).ready(function(){
    $(".up,.down").click(function(){
        var row = $(this).closest("tr");
        if ($(this).is(".up")) {
            row.prev().before(row);
        } else if ($(this).is(".down")) {
            row.next().after(row);
        }

        ResetSort();
    });

    $('.down').after(' <a href="#" class="delete">Delete</a>');
    $('.delete').click(function() {
        $(this).closest('tr').remove();
    });
});

function ResetSort() {
    $(':hidden[name="sort"]').each(function (i,v) {
        $(v).val(i + 1);
    });
}

Here is a working example: http://jsfiddle.net/JUh74/5/

UPDATE: Replaced parents('tr:first') with closest('tr'), as pointed out by fudgey

Oops... I misread your question. You want to keep the "value" or the "text" in order?

Add this inside the click function:

$('input').each(function(i){
    $(this).val(i+1);
});

so you end up with something like this:

$(document).ready(function(){
    $(".up,.down").click(function(){
        var row = $(this).parents("tr:first");
        if ($(this).is(".up")) {
            row.insertBefore(row.prev());
        } else {
            row.insertAfter(row.next());
        }
        // renumber input values (not the text)
        $('input').each(function(i){
            $(this).val(i+1);
        });
    });
});