jQuery .append() not working in IE, Safari, and Chrome
- by mkmcdonald
So I'm using jQuery's AJAX function to read some XML for me and it's worked just fine. But now I'm trying to manipulate the display property of 4 different dynamically generated divs. The size and x/y of the divs are determined by the XML and are parsed through.
My problem lies in the face that these divs either aren't being generated or just don't show up in IE, Safari, and Chrome. In Firefox and Opera, they do work. I'm using jQuery's .append() to create the divs and then the .css() functino to manipulate them. Looking in Chrome's developer tools, I am seeing that the css property being changed in the script is being overridden by the property in the stylesheet. Any fixes?
$(document).ready(function(){
$.ajax({
type: "GET",
url: "generate?test",
dataType: "xml",
success: function(xml) {
$(xml).find('template').each(function(){
var portion = $(this).attr('portion');
var select;
var name = $(this).find('$(this):first').text();
var mutability = $(this).attr('mutability');
var x = (parseInt($(this).find('x:first').text())*96)/72;
var y = (parseInt($(this).find('y:first').text())*96)/72;
switch(portion){
case "stub":
select = $('#StubTemplates');
select.append(""+name+"");
break;
case "body":
select = $('#BodyTemplates');
select.append(""+name+"");
y = y + 90;
break;
}
switch(mutability){
case "dynamic":
var width = (parseInt($(this).find('width:first').text())*96)/72;
var height = (parseInt($(this).find('height:first').text())*96)/72;
var n = name;
switch(portion){
case "stub":
$('.ticket').append("")
break;
case "body":
$('.ticket').append("");
break;
}
var top = $('#'+n).position().top;
var left = parseInt($('#'+n).css('margin-left'));
$('#'+n).css('top', (y+top)+"px");
$('#'+n).css('margin-left', (x+left)+"px");
$('#'+n).css('width', width+"px");
$('#'+n).css('height', height+"px");
break;
case "static":
var n = name;
switch(portion){
case "stub":
$('.ticket').append("");
break;
case "body":
$('.ticket').append("");
break;
}
break;
}
});
var stubActive = false;
var bodyActive = false;
$('#StubTemplates').find('.ddindent').mouseup(function(){
var tVal = $(this).val();
var tTitle = $(this).attr('title');
if(!stubActive){
$('.stubEditable').css('display', 'none');
$('#'+tVal).css('display', 'block');
stubActive = true;
}else{
$('.stubEditable').css('display', 'none');
$('#'+tVal).css('display', 'block');
stubActive = false;
}
});
$('#StubTemplates').find('#stubTempNone').mouseup(function(){
$('.stubEditable').css('display', 'none');
});
$('#BodyTemplates').find('.ddindent').mouseup(function(){
var tVal = $(this).val();
var tTitle = $(this).attr('title');
if(!bodyActive){
$('.bodyEditable').css('display', 'none');
$('#'+tVal).css('display', 'block');
bodyActive = true;
}else{
$('.bodyEditable').css('display', 'none');
$('#'+tVal).css('display', 'block');
bodyActive = false;
}
});
$('#BodyTemplates').find('#bodyTempNone').mouseup(function(){
$('.bodyEditable').css('display', 'none');
});
}
});
});
