this script is working in firefox or chrome but only gets half way in IE9 which is the top browser for our websites.
the problem im getting is its throwing this error.
SCRIPT438: Object doesn't support property or method 'append' calc_ajax.js, line 26 character 21
on this line: item.append(link);
and im stuck why. any help would be appreciated.
$(document).ready(function(){
$('.first a.btn').click(function(){
$('.first a.active').removeClass('active');
$(this).addClass('active');
$('.second .title').addClass('active');
var id = $(this).data('cat-id');
var wrap = $('<div>');
$.ajax({
url: script_url,
type: "post",
data: {"cat": id},
dataType: "json"
}).success(function(result){
if(result.status == "ok"){
$.each(result.data, function(i, elem){
item = $("<div class='body-area'>").append($("<img src='" + elem.image + "'>"));
link = $("<a href='#results' class='btn'>");
link.text(elem.name);
link.data('subcat-id', elem.id);
item.append(link);
wrap.append(item);
});
$('.second .body').html(wrap).slideDown('fast');
}
});
});
$('.second a.btn').live('click', function(){
$('.second .body-area.active').removeClass('active');
$(this).parent().addClass('active');
var sub_id = $(this).data('subcat-id');
$.ajax({
url: script_url,
type: "post",
data: {"subcat": sub_id},
dataType: "json"
}).success(function(result){
if(result.status == "ok"){
$('.third .title').text(result.data.title);
$('.third .body').html(result.data.body);
$('.third').slideDown('fast');
}
});
});
});
I got the same error on IE11 when using the native function document.body.append
.
You can either use document.body.appendChild
or insert the polyfill from MDN (npm).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With