I'm cloning a fairly complex div/ page and changing various things in it before appending it to the DOM.  The current method seems long-winded, and I was hoping if there was a simpler way of doing it?$.each(results.jobs, function(i, result){var theID = result.id,theTitle = result.title,theDescription = result.description,theLocation = result.location,theType = result.type,thePosted = posted[2]+'-'+posted[1]+'-'+posted[0],theAgency = result.company,theRef = result.reference,theSalary = '',theApps = result.number_of_applications,hasApplied = result.applied,theFeatured = result.featured,theJobNo = pages*i +1;if(result.hasOwnProperty('salary')){    var theSalary = result.salary.information.replace(//g, '');}var jobContainer = $('#job-container').clone(true, true).attr('data-jobno', theJobNo);jobContainer.find('h1').text(theTitle);jobContainer.find('#job-location').text(theLocation);jobContainer.find('#job-type').text(theType);jobContainer.find('#job-date').text(thePosted);jobContainer.find('#job-agency').text(theAgency);jobContainer.find('#job-description').html(theDescription.replace(//gi, '&pound;'));jobContainer.find('#job-ref').text(theRef);jobContainer.find('#job-id').text(theID);jobContainer.find('.apply-btn, .email-btn, .save-btn').attr('id', theID);jobContainer.find('.save-btn').text('Save Job').removeClass('job-saved');if(localStorage[saved]!=null && localStorage[saved]!= '[]'){    if(localStorage[saved].indexOf(theID)>= 0){        jobContainer.find('.save-btn').addClass('job-saved').text('Job Saved');    }}if(theFeatured === '1'){    jobContainer.find('#job-featured').show();}else{    jobContainer.find('#job-featured').hide();}if(localStorage[applied]!=null && localStorage[applied]!= '[]'){    if(localStorage[applied].indexOf(theID)>= 0){        jobContainer.find('.job-alert').show();    }}if(theSalary != null){    jobContainer.find('#job-row-salary').show();    jobContainer.find('#job-salary').text(theSalary);}else{    jobContainer.find('#job-row-salary').hide();}if(theApps === '0'){    jobContainer.find('#job-apps').html('<span style=color:#219a00>Be first to apply!</span>');}else{    jobContainer.find('#job-apps').html(theApps);}viewJobList.push(jobContainer)});$('#slider').html('').append(viewJobList)This is inside an Ajax success function which is made to an API. I'm cloning an existing page in the HTML and adding new information, adding it to an array/ list then appending to the DOM just the once.
DOM cloning in a loop
javascript;jquery;ajax