Question

success: function(json) {
            for (var i = 0; i < json.length; i++) {
        var response = json[i];
         $('#rv-container').html('<p>' + response.name + '</p>' + '<span>' + response.id + '</span>');
    }
        $('#history_tracking').hide();
    
        }

In the success callback $(#rv-container).html() will not work, but .prepend does.

Why doesn’t jQuery allow for .html in the success callback?
The problem is the html loaded via ajax keeps on piling up ontop of the data already loaded. So it doesn’t replace the data currently in the #rv-container

HTML:

<div id="bottom-toolbar">
  <div id="rv-facet">
    <div id="rv-fix">
      <li id="rv-title">
        Recently Viewed <span class="total_viewed"></span>
        <div id="rv-total" style="float:right; margin-right:25px;"></div>
      </li>
    </div>
    <div id="rv-content">
      <div id="rv-container">
        <div id="history_tracking"></div>
      </div>
    </div>
  </div>
</div>

Is there anyway to have prepend replace the contents of the div?

Answer 1

You are calling it in a loop, so obviously it makes a difference whether you are resetting the HTML content over and over (.html()) or prepending more and more to it (.prepend())?