Question

With the help of someone I’ve created a script which loads JSON content in a page. The problem is that the content is loaded too many times instead of just once. This is the jquery function which is included in the head of the page in a file called main.js:

    function bakVorm(page,targetClass)
     {
     $.getJSON('http://shop.com/'+page+'/?format=json', function(data){
      var text = ''
      $.each(data.textpage, function(index, text){
      $(text).html('' + text + '').appendTo(targetClass);
});
});

On a product page I try to load the content in a div with this code:

$(function(){
bakVorm('vraag','.eigenschappen');
bakVorm('test','.verzendkosten');
});

Problem is that the content is loaded too many times in the corresponding div. Probably the script isn’t stopped or something.

Any help is more then welcome

Answer 1

In this line

$(text).html('' + text + '').appendTo(targetClass);

You are adding the contents of text to each top level node in text, so if text is

 <div></div><p></p>

You’ll end up with

<div><div></div><p></p></div><p><div></div><p></p></p>

So leave out the html part, and just have

$(text).appendTo(targetClass);