Scrolling list, with sticky list element (fixed)

Scrolling list, with sticky list element (fixed)

Hello!

I've tried to figure out fancy way to make kind of "donators ranking list", and imaged to build it with:
<ul>
      <li>13. Donator 1, amount $1000</li>
      <li>14. Donator 2, amount $950</li>
      <li id="me">15. Donator ME!, amount $800</li>
      <li>16. Donator 3, amount $600</li>
      <li>17. Donator 4, amount $300</li>
</ul>

If we've situation, that you donate $175 more, and then take 14th place in rank, whole other list should scroll down, but li#me should be "fixed".

I thought that it would be easy to do with:
  1. $("li").css({'position':'fixed'});
  2. $("ul").prepend('<li>12. Donator 5, amount $1200</li>');
  3. $("ul > li:last").remove();
And then it would look like you stay whole time in place, but list scrolls "under" you.

Any good ideas, thanks!