Data from database not displaying on new page (JavaScript/HTML)

I am attempting to get the data fetched from the query to be displayed on a different page, however the data is not being displayed on a new page.

The table was being displayed with the data correctly on the same page as the search, however when I tried to change things around so the data is shown on a new page it doesn't work.

I am using JQuery mobile, so it's a one page structure (all pages under index.html) and I have all my javascript on a separate file.

Can anyone see the issue here?

Fetching data function:

    function fetchEvent()
             {
          db = window.openDatabase("SoccerEarth", "2.0", "SoccerEarthDB", 2*1024*1024);
          db.transaction(foundEvent, errorCB);
         }

          function foundEvent(tx)
            {
            var TitleT = document.getElementById("texttitle").value;
           tx.executeSql("SELECT * FROM SoccerEvents WHERE Title LIKE '%" + TitleT + "%'", [], renderEvent);
                        }

function renderEvent(tx, response) {
   /* var div = document.getElementById("responsediv"); */
    var temp = "<table border=\"1\"><tr><th>Title</th><th>Location</th><th>NoPeople</th><th>Date</th><th>Description</th></tr>";

    for (var i = 0; i < response.rows.length; i++) {
        temp += "<tr><td>" + response.rows.item(i).Title + "</td><td>" + response.rows.item(i).Location + "</td><td>" + response.rows.item(i).NoPeople + "</td><td>" + response.rows.item(i).Date + "</td><td>" + response.rows.item(i).Description + "</td></tr>";
         /* div.innerHTML = temp; */
    }
    var page6 = window.open("#page20", "mywin", '');
    page6. dataFromParent = temp;
    page6.render();
}
    var dataFromParent;
    function render() {
        $('datadisplay').innerHTML(dataFromParent);
    }

HTML (page 6):

    <div data-role="page" id="page20" data-theme="d">

    <div data-role="content">
        <div id="datadisplay">
        </div>
    </div>
</div>