jQuery Font Resizer

First, the CSS:

body, a#medium {
font-size:14px;
}
body.small, a#small{
font-size: 10px;
}
body.large, a#large{
font-size: 18px;
}

Second, the JS:

$(function() {
$("a#large").on("click", function (event) {
$("body").removeClass("small");
$("body").addClass("large");
event.preventDefault();
});

$("a#medium").on("click", function(event) {
$("body").removeClass("small");
$("body").removeClass("large");
event.preventDefault();
});

$("a#small").on("click", function(event) {
$("body").addClass("small");
$("body").removeClass("large");
event.preventDefault();
});
});

Third, the HTML:

<a id="small" href="#">A</a>
<a id="medium" href="#">A</a>
<a id="large" href="#">A</a>

Check it out