Question

I have to display the text boxes and list boxes when click on the edit button. Please give suggestion to how to do that things.

HTML:

<div class="textboxes">
<ul>
    <li><input type="text" id="txt" /></li>
    <li><input type="text" id="txt" /></li>
    <li><input type="text" id="txt" /></li>
</ul>
</div>

<input type="button" value="Edit" id="editBut" />

Javascript:

$("input[type='text']").blur(function(){
    $(this).hide().after('<span class="dfk">' + $(this).val() + '</span>');
});

Here js fiddle : http://jsfiddle.net/thilakar/yvNuC/11/

Thanks

Answer 1

Try this

$("#editBut").click(function() {
 $('.textboxes span').hide();
 $('.textboxes input[type=text]').show();

});

Check this DEMO