Raja Shekar Raja Shekar - 7 months ago 13
Javascript Question

change label to a Empty textbox by using jQuery

I want to replace a Label with a empty textbox by using Jquery function. Below is the code which I have worked.

<label>Label1</label><br />
<input type="button" value="Edit" id="Edit" />
$( "#Edit" ).click( function() {
$( "label" ).replaceWith( function() {
return "<input type=\"text\" value=\"" + $( this ).val("") + "\" />";
});
});


Link

Answer

Label do not have value property associated with it. You need to use .text() instead of .val() to get the text content:

$( "#Edit" ).click( function() {
    $( "label" ).replaceWith( function() {
        return "<input type=\"text\" />";
    });
});

Working Demo