scrollTop(), offset(), or ???

scrollTop(), offset(), or ???

I have a div with a scrollbar. I have a bunch of spans and I would like to use scrollTop() or offset() to get my span to the top. I can get scrollTop( pixels ) to work, but I'm wondering if you can use an ID instead, or am I using the wrong function.

    <div id="textOne">
      <span id="s1">I have a paragraph that is full of spans.</span> <span id="s2">I need to      be able to put each span to the top on command.</span> <span id="s3">I don't want them to automatically line up on the left, only on the top</span> <span id="s4">And I need all of the text to be accessable with the scrollbar</span>  <span id="s5">For this demo, I'll make a button to get to s3, but I need to do this in the background, so keep that in mind   please.</span>
    </div>
    
    <input type="submit" id="submit" value="SPAN 3">

----------------------------------------------------------------------------------------


    $(function() {
        $('#submit').click(function() {
            $('#textOne').scrollTop($('#s3'));
        });
    });