On this page, http://www.webrichtlijnen.nl/, when scrolling down you see that there will be added to arrows that are used to get back to the top off the page.
I looked at the script and thought this could be made with jQuery a lot easier. At the moment I have this: jQuery(function($) { $(document).scroll(function() { $('<div id="scroll_top"><a href="top" class="scroll_top_left">Naar boven</a><a href="top" class="scroll_top_right">Naar boven</a></div>') .appendTo('#canvas'); if (document.documentElement.scrollTop == 0) { $('#scroll_top').hide(); } }); }); This works good, the only thing I want is that <div id="scroll_top"> only added once and not everytime when I scroll. I also tried this but when it's added and you get back to the top it won't be inserted again. jQuery(function($) { $(document).one('scroll', function(event) { $('<div id="scroll_top"><a href="top" class="scroll_top_left">Naar boven</a><a href="top" class="scroll_top_right">Naar boven</a></div>') .appendTo('#canvas'); if (document.documentElement.scrollTop == 0) { $('#scroll_top').hide(); } }); }); How could it be fixed that it works just the way I want?