How to reset <div> to return to the response state before AJAX after the search field is cleared?

Question

I have an HTML page that lists all the data from the database. I have included a search box that allows the user to search for a specific “line” through the Perl / AJAX process. It works wonderfully. The user enters the information, and the div containing the source list is overwritten with the results of the AJAX request. As they continue to modify the information in the search field, the AJAX process continues to fire and everything works well. The problem arises when they try to return to the original "all" list, clearing everything from the search field, and not just reloading the page. This made me wonder if it is possible to make a div return to its original state (before it was overwritten with an AJAX response)?

Below I will talk about some code fragments, but I'm sure that this is not something especially original.

JavaScript:

            function myTimer() {

            var typingTimer;
            var doneTypingInterval = 2000;

               $("#devicename").keyup(function(){
               clearTimeout(typingTimer);
               if ($('#devicename').val()) {
               typingTimer = setTimeout(updateText, doneTypingInterval);
               }



            });

                    function updateText() {

                    var devname = $('#devicename').val();
                    $.get("http://domainname/cgi-bin/ajax.pl", "devicename="+devname,
                            function(response,status,http) {
                                    $('#resultsbox').html(response);

                            }, "text");
                    }

            }

HTML

<div id="resultsbox">
<table class="devicetable">
 <tr>
    <td class="tablehead">Company Name</td>
    <td class="tablehead">ID</td>
    <td class="tablehead">Status</td>
    <td class="tablehead">Ticket</td>
    <td class="tablehead">Device/Ticket Notes</td>
    <td class="tablehead">Open SR</td>
 </tr>
<tr> lots of stuff </tr>
</div>

Perl

sub generate_results {
       #DBI stuff, result is formatted and loaded into $result
       print $html->header('text/html;charset=UTF-8');
       print $result;
 }

, . , . , , div, reset . , . - , , , , , , , . , .

Answer 1

div html - , .

javascript:

// store original html
var originalHtml = div.innerHTML;

// restore it
div.innerHTML = originalHtml;

jquery, :

// store original html
var originalHtml = $('#resultsbox').html();

// restore it
$('#resultsbox').html(originalHtml);