Change font sizes

I have a script to make font sizes larger/smaller when a user clicks on an icon. Is it possible to make it so not only <p> tags are made larger/smaller, but ALL font on the page?

Here is the script I have:

<script type='text/javascript' language='javascript'>
var min=8;
var max=24;
function increaseFontSize() {
var p = document.getElementsByTagName('p');
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = 16;
}
if(s!=max) {
s += 1;
}
p[i].style.fontSize = s+"px"
}
}
function decreaseFontSize() {
var p = document.getElementsByTagName('p');
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = 16;
}
if(s!=min) {
s -= 1;
}
p[i].style.fontSize = s+"px"
}
}
</script>

I think that better solution of resizing font size is store selected font size in the cookie, and then include the external CSS definition file based on the value stored in cookie.

e.g:

<?php if ($_COOKIE['fontsize']=='small')
echo '<link rel="stylesheet" type="text/css" href="small.css">'; ?>


etc..

What do you mean? I am totally new at this coding thing.

I mean.. is it absolutely necessary use javascript to resize fonts? Because, when user refresh the page, selected font size will be default again.. So you need to use some server side solution like cookie and CSS file, I think..