RhysO RhysO - 1 year ago 40
jQuery Question

JQuery not appending properly

I'm trying to load some XML using the

function, and that bit is going fine. I'm loading the XML and putting it into the DOM, which is what I want. However, I then need to iterate through the top level child elements and append certain nodes to a different Container. All will become clear when you see the below code:

this is my JS and the storage element:

<div id="ProjectLoad" style="display:none"></div>

<script type="text/javascript">

var name = $(this).children('name').first().text();
var desc = $(this).children('desc').first().text();
var created = $(this).children('created').first().text();
var uri = $(this).children('url').first().created();

$('#trapezoidContainer').append('<div id="' + name + '" class="trapezoid-container"></div>');

$('#' + name).append('<div id="sub-' + name + '" class="trapezoid"></div>');

$('#sub-' + name).append('<a href="' + uri + '">' + name + '</a>');



And this is my projects.xml:

<desc>Simple test project</desc>

I have a debugger statement in the
, but it isn't being hit, which is making me thing the
is executing after the
due to latency...

Answer Source

You have to use the complete option in load-

$('#ProjectLoad').load('projects.xml', function() {
 //just after the end of loading
//and so on