Question

This is what I am trying to get: when you click #edit jQuery finds in the closest tr the td called #collapse, and replaces its content with an input which has as value the previous #collapse html.
I tried on jsFiddle without any success: http://jsfiddle.net/8PDdn/1/

Can anyone help me to get what I wanted to get?

Answer 1

preventDefault() is one of the methods of the event object not the selected element, you should call it for the event object instead, also you can use the blur event of the input for modifying contents of the div tag after editing:

$(function() {   
    $("a#edit").click(function(event) {
        event.preventDefault();
        var currentTodo = $("#collapse");
        var cVal = currentTodo.html();
        currentTodo.html('<input type="text" name="description" value="'+ cVal +'">');
    });

    $(document).on('blur', '#collapse input', function(){
        $(this).parent().html(this.value)
    })
});

Fiddle