jquery reload div X amount of seconds problem

Question

I know there are a million examples and tutrials on how to reload a DIV in jquery every X amount of seconds, here is the example code I am using right now

<script> 
var auto_refresh = setInterval( 
function(){ 
  $('#notificationcontainer').load('http://localhost/member/beta_new/notifications.inc.php'). 
  fadeIn("slow"); 
}, 10000); 
</script>

The above code loads the DIV notificationcontainer

My problem is I need to load DIV notificationcontainer on page load and then refresh every X amount of seconds, this code currently makes the page wait X amount of time on initial page load and I need to show the div right away on page load but then also update it every X amount of time, please help

Answer 1

Run the function before calling setInterval

Answer 2

Create a function which loads the DIV, call it once in document.ready and pass it to setInterval function so that will be called periodically.

<script>
    var refreshNotification = 
        function() 
        {   
            $('#notificationcontainer').load('http://localhost/member/beta_new/notifications.inc.php');
            fadeIn("slow"); 
        };

    $(document).ready(
        function()
        {
            refreshNotification();
            var autoRefresh = setInterval(refreshNotification, 10000);
        }
    );
</script>

Answer 3

Just move the function() out, give it a name, then onload call that function along with a setInterval that calls the same function.