jquery - How to replace a div content with another and then be able to retrieve the contents of the first div? -

i wrote jquery function replace contents of div id quotecontact div of id quotenext on clicking link of 'next' in div#quotecontact. works fine.but have link of 'back' in div#quotenext needs link quotecontact div doesn't work. put code below, let me know wrong.

<div class="slidingdiv"> <div id="quotecontact" style="display:none >      <a href="#" class="nextquote" data-target="quotenext" style="color:#000;font-size:19px">                                                         next                                                         </a> </div> <div id="quotenext" style="display:none;"> <a href="#" class="nextquote" data-target="quotecontact" style="color:#000;font-size:19px">                                                           <                                                         </a> </div> 

<script type="text/javascript"> var $j = jquery.noconflict(); $j(".nextquote").click(function(e) {     e.preventdefault();     $j(".slidingdiv").html($j("#"+$j(this).data('target')).html());     $j(".slidingdiv").show("slide", {         direction: "right"     }, 200); }); }); </script> 

you removing current div quotecontact dom once clicked on next there no way work if click on trying show div doesn't exits in dom anymore. need instead hide / , show them. or create them dynamically of can't keep in dom. here write that. , see demo here.

var $j = jquery.noconflict(); $j(".slidingdiv").on('click', '.nextquote', function (e) {      e.preventdefault();      $j(this).closest('div').hide("slide", {         direction: "right"     }, 200);      $j("#" + $j(this).data('target')).show("slide", {         direction: "right"     }, 200);  });