<div class="main"> <button class="btnclick" type="button"> </button> <button class="btnclick" type="button"> </button> <div class="child"> <p> ** child text ** </p> <textarea id="edit" class="hidden"></textarea> //class hidden == display:none </div> </div> <div class="main"> <button class="btnclick" type="button"> </button> <button class="btnclick" type="button"> </button> <div class="child"> <p> ** child text ** </p> <textarea id="edit" class="hidden"></textarea> //class hidden == display:none </div> </div>
am trying implement edit section above code. above <div>
generated dynamically , when user click button need hide <p> "** child text ** " , make textarea visible
particular div , copy
section textarea
i tried on button click
$(this).closest('#edit').removeclass("hidden");
but didn't worked , other code every time first textarea visible irrespective of button click
what looking on first button click particular <div> textarea class hidden removed , copy the<p> text textarea on particula <div>
what best way this. , can add new class , make code generic. ideas !!
you should remove id textarea avoid having multiple id's same.
this function need.
$(document).on('click', '.btnclick', function(){ //cache child div block (everything want in here) child = $(this).next('.child'); //hide p tag child.find('p').hide(); //this copies p tag in child.find('textarea').val( child.find('p').html() ); //this shows textarea child.find('textarea').show(); });
here jsfiddle: http://jsfiddle.net/6wauk/
Comments
Post a Comment