rather than adding a new html page you could split the existing index.html into "pages" with each page in a and then use the javascript to manipulate the visibility of the divs.
so the javascript looks like this
function hide_me(el) {
if(document.getElementById(el)) {
if(document.getElementById(el).style.display != "none")
document.getElementById(el).style.display = "none";
}
}
function show_me(el) {
if(document.getElementById(el)) {
if(document.getElementById(el).style.display == "none")
document.getElementById(el).style.display = "block";
}
}
then in the html
<ul>
<li><a href="javascript:
show_me('one');
hide_me('two');
hide_me('three');
etc......
</li>
</ul>
and further down the index.html
<div class="mainContent" id="one">
<!-- generated html -->
<table>
<tbody>
<tr class="head">
<td class="item" colspan="2">
CHMOD
</td>
</tr>
etc .....
</table>
</div>
This way the load is all taken when the widget is fired up and therafter you just display the divs as opposed to having to load them