Question

I am having difficulty getting jQuery’s ToggleClass to increase and decrease my ‘p’ font-size. When the increase icon is clicked i would like the fontSize of my paragraph text ‘id=#text’ to increase 16px and when the icon is clicked again decrease back 14px. I figure the best way to achieve this goal is to use jQuery’s ToggleClass but it does not seem to be working properly.
Any suggestions or solutions are welcome and appreciated.

jQuery code:

$(function(){
  $(".large-type").live("click",function(){
    $("#text").toggleClass("large");
  });
});

HTML5 code:

<p id="text">
    MANHATTAN, KAN - The Longhorns, three games into their defense of the No. 1 ranking, come to  a place where the opponent is formidable, the crowd is raucous, and the reference might just wear out their whistles.<br><br> They come to face No. 13 Kansas State, an in-your-face team that reflects the personality of its coach, Frank Martin. The wildcats spend much of their games fouling and shooting free throws.<br><br>All 12,528 tickets have been sold, and coach Rick Barnes hopes the Longhorns can summon the fortitude Texas A&M showed in the packed Erwin Center on Saturday during a 72-67 loss to the Longhorns in overtime.<br><br>"It's gonna be flipped Monday," Barnes said. "We're not gonna have the house. I hope we go in with the same intensity A&M brought."<br><br>Kansas State has 13 consecutive victories at home, its longest streak in Manhattan since winning 20 straight in 1981-82.<br><br>The Longhoorns and Wildcats would not be called rivals, but you couldn't tell by their games in recent seasons.<br><br>Barnes is 8-4 against Kansas State. The Longhorns have won four of the last six, but five of those games were decided by four points or fewer. Texas has won the last two in Manhattan. K-State has a two-game winning steak in Austin.
</p>

Answer 1

Defining the following in your css may solve your issue.

#text { font-size:14px}
#text.large{ font-size:16px}