CODEWITHSUNDEEP
javascriptjqueryinternet-explorer-8internet-explorer-7
rickyduck
rickyduck

Reputation: 4084

Javascript code doesnt work in IE8/7

This code works in chrome/ff/ie9 however not ie8/7.

http://jsfiddle.net/vDZJM/6/

Here is the JS:

function doDistricts(theData){
    var district="";
    var district="";
    $(theData).find("district").each(function(){

        var theDistrict = $(this);
        var districtName = theDistrict.text();
        var level = theDistrict.attr("level");
        var attr = theDistrict.attr('deleted');
        if(typeof attr !== 'undefined' && attr !== false){
            district=district+'\t\t\t<div class="district deleted">\n';
            district=district+'\t\t\t\t<header class="clearfix doNode" data-role-id="'+districtName+'" data-role-nodeLevel="'+level+'" data-role-nodeValue="'+districtName+'">\n';
            district=district+'\t\t\t\t\t<span class="arrow"></span>\n';
            district=district+'\t\t\t\t\t<img src="/img/address_list/map.png" alt="'+districtName+'" class="icon" />\n';
            district=district+'\t\t\t\t\t<span class="text">'+districtName+'</span>\n';
            district=district+'\t\t\t\t\t<a class="add" href="#">Add</a>\n';
            district=district+'\t\t\t\t</header>\n';
            district=district+'\t\t\t\t<div class="children"></div>\n';
            district=district+'\t\t\t</div>\n';
        }else{
            district=district+'\t\t\t<div class="district">\n';
            district=district+'\t\t\t\t<header class="clearfix doNode" data-role-nodeLevel="'+level+'" data-role-id="'+districtName+'" data-role-nodeValue="'+districtName+'">\n';
            district=district+'\t\t\t\t\t<span class="arrow"></span>\n';
            district=district+'\t\t\t\t\t<img src="/img/address_list/map.png" alt="'+districtName+'" class="icon" />\n';
            district=district+'\t\t\t\t\t<span class="text">'+districtName+'</span>\n';
            district=district+'\t\t\t\t\t<a class="remove" href="#">Remove</a>\n';
            district=district+'\t\t\t\t</header>\n';
            district=district+'\t\t\t\t<div class="children"></div>\n';
            district=district+'\t\t\t</div>\n';
        }

    });
    return district;
}

$('div.1').html(doDistricts($(theData)));

In a working environment with more code etc, the content is generated but the <header> tag is prematurely closed, meaning all the code that should be inside the <header> tag (<span class="arrow"> etc) actually goes outside of it. Why would this be?

Upvotes: 0

Views: 218

Answers (1)

Tom
Tom

Reputation: 12669

If your document is html5 you will need to use innershiv when adding elements to the DOM

http://jdbartlett.com/innershiv/

Upvotes: 2

Related Questions