添加动态内联编辑输入框

Question

我使用内联编辑为动态表编写了以下代码。
其中我只编辑了行的第二个td。所以我想显示我正在编辑的td 。点击edit按钮时添加输入。同样，我想hide点击更新按钮后input box。
请任何帮助。

function editData() {
    $('.update').hide();
    $('.edit').click(function () {
        debugger
        var editId = $(this).attr('id');
        $("#" + editId).hide();
        var number = editId.replace("edit", "");
        $("#update" + number).show();

        var currentTD = $(this).parents('tr').find(':nth-child(2)');
        $.each(currentTD, function () {
            $(this).prop('contenteditable', true)
        });
    });

    $('.update').click(function () {

        var updateId = $(this).attr('id');
        $("#" + updateId).hide();
        var number = updateId.replace("update", "");
        $("#edit" + number).show();

        var currentTD = $(this).parents('tr').find(':nth-child(2)');

        $.each(currentTD, function () {
            $(this).prop('contenteditable', false)
        });


    });

}

https://jsfiddle.net/wjb0an9m/