I would like to change the main paragraph font size from it's default 14px to 16px when anchor tag "large-type" is clicked.

I have attempted to do this with the CSS and jQuery code below but it is not working correctly. The strange thing is when I add font weight bold to the "large" class the code below works.

Any Help and suggestions are appreciated!

Thanks

CSS code:
Code:
/*default size */

#mainContent p{
                          font-size: 14px;
                          font-family: sans-serif, Arial,"MS Trebuchet";
                          line-height: 16px;
}
	
/* large-type icon - increases body font size */

.large {
	    font-size: 16px; 
            font-family: sans-serif,Arial,"MS Trebuchet";
}
jQuery code:
Code:
$(function(){

$('a.large-type').click(function() {
    $('#mainContent p').toggleClass('large');
         return false;
     });
});