CODEWITHSUNDEEP
jqueryinternet-explorerinternet-explorer-11
graywolf
graywolf

Reputation: 7510

Appending element is not working in IE11

In constructor I create an element

var this.legendElement = this.compileLegend();

and than later I want to use it in event listener:

var takeControl = function() {
    this.element.empty();
    this.legendElement.appendTo(this.element);
}

legendElement is appended, but it is empty! I don't understant why. In other browsers (tested firefox, chrome) it is working.

Also when I print content of this.legendElement I see html code as expected. In other words

console.log(this.legendElement);

produces expected html code with correct content (and I call it inside the takeControl function).

I tried several way to fix it

this.element.append(this.legendElement)

does not work either.

This:

this.element.append(this.legendElement.html())

appends the html code, but without this.legendElement around it (which is expected).

So the following

this.element.append($('<div />').append(this.legendElement).html())

does what I want it to do, but it just seems like such an ugly hack.

So, my question is: What's happening and have can I get

this.element.append(this.legendElement)

to work?

Thanks in advance! ^_^

Upvotes: 8

Views: 20777

Answers (3)

antoni
antoni

Reputation: 5546

Instead of the unsupported el.append() you should use the universal el.appendChild()!

Upvotes: 2

Zane
Zane

Reputation: 4752

IE11 (at least my version or settings) did not support element.append. It did, however, work as expected with element.appendChild.

The browser compatibility section of MDN confirms that IE (in contrast to every other browser) has never had ParentNode.append support but has always had Node.appendChild support, which appears to be universal.

Upvotes: 14

graywolf
graywolf

Reputation: 7510

I did not find reason for this error but I bypassed it by constructing element subtree (the compileLegend function) each time when I wanted to append. It required some ugly code to get listeners right but it's the only thing that worked for me.

Upvotes: 0

Related Questions