How do I script for resetting the default font size with Javascript?

Question

This is related to this question.

The answer was given with the script below to reset the font size back to the default:

function resetToDefaultFontSize() {
   var p = document.getElementsByTagName('div');
   for(i=0;i<p.length;i++) {
      p[i].style.fontSize = "12px";
   }
}

This works fine for a page that only has one font size of 12 px. How can the script be modified to allow up to three different font sizes on the same page?

Answer 1

Try fontSize = "inherit";

Answer 2

First, I would set my body font-size to 75% using CSS. This will set the overall font to 12px. Once this has been done, you can use:

fontSize = '1em';

So my JavaScript would look like:

function resetToDefaultFontSize() {
    var body = document.getElementsByTagName('body')[0];
    body.style.fontSize = '1em';
}

If you use this technique, you need to make sure all other font-sizes on the page are using the em unit.