Effective Way of Increasing/Decreasing Font Size of All Elements on Page
<p>In order to improve UX, I'm planning to have a font size increase/decrease/reset tool on all the pages of my website (A-, A, A+)</p>

<p>The problem I'm facing is that the font size used by different elements on the page is <strong>not uniform</strong>. Some are 14px, some are 18px, some are 12px and some are 15px.</p>

<p>As such, using the <code>body</code> tag for manipulating the font size will not get the desired result.</p>

<p>Is there a solution which will go through each element (get its present size) and increase its font size by 1 if <code>A+</code> was clicked or decrease the size by 1 if <code>A-</code> was clicked and reset back to the originals if <code>A</code> was clicked?</p>

<p>PS: I'm open to jQuery solutions too.</p>