Append vs Build and append

[jcanker]

I have a function that uses this code:

customer.base.busname = $(this).find('busname').text();
$("<div id='custTitle'><span>"+ customer.base.busname+"</span></div>").appendTo('#baseContact');
customer.base.buscode = $(this).find('buscode').text();
$("<div><span>Customer Code:  </span><span>"+ customer.base.buscode+"</span></div>").appendTo('#baseContact');
customer.base.custtype = $(this).find('custtype').text();
$("<div><span>Customer Type:  </span><span>"+ customer.base.custtype+"</span></div>").appendTo('#baseContact');
customer.base.servicelevel = $(this).find('servicelevel').text();
$("<div><span>Service Level:  </span><span>"+ customer.base.servicelevel+"</span></div>").appendTo('#baseContact');
//for quick access, we'll put the admin phone contact here so we don't have to reveal the entire admin contact to get a phone # for residential
//TODO: Program this so it only appears if the customer is residential
customer.base.adminPhone = $(this).find('adminphone').text();
$("<div><span>Phone:  </span><span><a href='tel:"+ customer.base.adminPhone+"'>"+ customer.base.adminPhone+"</a></span></div>").appendTo('#baseContact');
customer.base.adminMobile = $(this).find('adminmobile').text();
$("<div><span>Admin Mobile:  </span><span><a href='tel:"+ customer.base.adminMobile+"'>"+ customer.base.adminMobile+"</a></span></div>").appendTo('#baseContact');

to parse through some returned xml and show the customer's info.  This code runs fine on a desktop browser, but it's painfully slow on a smartphone. 

 

Would I be better off creating a string variable, building it up with all the html output, and then appending it all to the baseContact div in one shot?  I suspect part of the slowness is the jqueryUI tabs widget that's also in place, but I'm not sure. 

[trq]

Would I be better off creating a string variable, building it up with all the html output, and then appending it all to the baseContact div in one shot?

 

Indeed you would be. I don't have any links around, but there are numerous articles around the net about optimizing jQuery code. This is definitely one of those tips.