resizing text

Hello I am not very familliar with javascript but i have this little code snippet

$(function(){
$('input').click(function(){
var ourText = $('ul');
var currFontSize = ourText.css('fontSize');
var finalNum = parseFloat(currFontSize, 10);
var stringEnding = currFontSize.slice(-2);
if(this.id == 'large') {
finalNum *= 1.2;
}
else if (this.id == 'small'){
finalNum /=1.2;
}
ourText.animate({fontSize: finalNum + stringEnding},600);
});
});


and it enables you to make the font size larger or smaller for an element. It works perfectly but what I want it to do is only work on one element at a time. I want to put this on a search result page and be able to make the text larger or smaller for any individual result. Is this possible. I have all the text in the ul tag. and several instances of the ul tag. I want this to display on each result which it currently will but if I change the font size on one it changes all. Is there a way to stop that? thanks.

By the way I found this at
http://dev-tips.com/featured/jquery-tip-font-resizing-with-animation-effects
if that helps.

I am also open to any other way to achieve this. I do like the animation of this though so I would like to keep this if possible, if not no big deal. I just want something that works and is user friendly.

Here is another code that works
http://davidwalsh.name/change-text-size-onclick-with-javascript
but again I would need a way to make it only change the current ul element. lets say i have 10 results all of them in a separate ul tag. Is there a way to make it so the script will only control the current ul element?

We suppose this is JQuery (a JavaScript library/framework), not JavaScript in itself. I'll move the thread into the proper sub-Forum