setInterval not working properly - php

Question

I have been searching all over the internet tonight, saw a lot of "solutions" but not working for me unfortunately. So I will try to get different answer of what I am seeing here on stack and elsewhere and hoping I will find one which will work...
My page has the following javascript bit:
logbook = setInterval(function () {
$.getJSON("php/log.php", function(data) {
$.each(data.posts, function(i,data) {
$('#logspan').replaceWith(data.logupdate);
});
});
}, 5000);
When I run the page, it works, but only ONE time and then it stops the interval completely (this is in Chrome and Firefox) and basically gives up.
This is weird, because there is yet another script which is running as follows and is doing its job perfectly:
var timer;
function startCount() {
timer = setInterval(count,1000);
}
function count() {
var el = document.getElementById('counter');
var currentNumber = parseFloat(el.innerHTML);
el.innerHTML = currentNumber+1;
}
I already tried to see if the first script works if I turned the second one off, but it is still no go. So, how can I ever make the first (JSON) script work? It is way past my bedtime thanks to this problem and I haven't gotten any step further!! pulls hair
Any suggestions / hints / tips are appreciated...
EDIT: Ok, I found something peculiar, when I replace the "replaceWith" and use "appendTo" it seems to update the #logspan just fine, but obviously I do not want to spam my own webpage. Maybe the problem lies somewhere else?

Answer 1

Agreed.
Use a different variable name than data in your $.each() function body, as you may be inadvertently referring to the data in the $.getJSON() function body
Since you're iterating over the posts returned in the JSON call, empty out the body of #logspan only once, then append the content of each post sequentially to #logspan.
var logbookTimer = setInterval(function () {
$.getJSON("php/log.php", function(data) {
// Empty out the body of the log
$('#logspan').empty();
// Add some content for each retrieved post
$.each(data.posts, function(i,d) {
$('<div>').html(d.logupdate).appendTo($('#logspan'));
});
});
},5000);

Answer 2

try this way
var logbook = function () {
$.getJSON("php/log.php", function(data) {
$.each(data.posts, function(i,data) {
$('#logspan').replaceWith(data.logupdate);
});
});
};
setInterval(logbook, 1000);