javascript - remove content using ajax -

i new ajax.

i have index.html

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>  <script> $(document).ready(function(){   $("button").click(function(){     $.ajax({url:"n.php",success:function(result){       $("#div1").append(result);     }});   }); }); </script>  <div id="div1" style="margin-left: 25;"></div> <button>add author</button> 

demo.php

name:<input type="text" name="txtname"> age:<input type="text" name="txtage"> 

above code adds name , age textboxes on index.html page when 'add author' button clicks without refreshing page.

now want put button 'remove author',and want perform exact opposite action(i.e) remove name , age textboxes added previously.

i don't know how this.is possible through $("#div1").(result);

thanx in advance.

try one

      <div id="div1" style="margin-left: 25;"></div>       <button id="addauthor">add author</button>       <button id="removeauthor">remove author</button>    <script>       $(document).ready(function(){          $("#addauthor").click(function(e){          e.preventdefault();          $.ajax({url:"n.php",success:function(result){          $("#div1").html(result);             }});         });          $("#removeauthor").click(function(e){                e.preventdefault();                var lastnode = $("#div1").children().last();                lastnode.prev().remove();                lastnode.remove();          });       });  </script>