I have setup a online bank system using full ajax. This means that everything happens on one page.

```
<div class="login">
    <input type="text" class="username">
    <input type="password" class="password">
    <input type="submit" value="Login">
</div>
<div class="dashboard">
    <div class="nickname"></div>
    <div class="balance"></div>
    <div class="transactions"></div>
</div>

```

The dividers `login` and `dashboard` are initially hidden on page load, but, based on the existence and the validity of sessions, are shown. (So if you are logged in, dashboard shows, and if you're not, login shows)

In the dashboard, there is sensitive data such as your current balance, your recent transactions and more. When a user decides to log out, that information is still present within the HTML.

I do not want to do something such as:

```
$(".nickname").html('');
$(".balance").html('');
$(".transactions").html('');

```

Note that I have much more markup, nested, and more complex than just `.html`.

**I do not wish to just refresh the page on log out.**

By not refreshing the page, I can not delete HTML nodes such as `$(".dashboard").html()`, as that would break any code that puts data into those divs after a person logs in.

What I'm trying to prevent is say, someone who logs in, logs out, then someone else comes in, and uses firebug/chrome dev console to peak at the source dashboard. Currently what happens is, the dashboard is hidden, cookie is removed, and login is shown. The data in the dashboard is not cleared.

Is there a way I could save the current HTML page, then when the user logs out, I can reset the entire page without refreshing?