Bug Tracker

#3893 closed bug (invalid)

Opened January 16, 2009 05:37PM UTC

Closed January 17, 2009 03:57AM UTC

Last modified October 27, 2011 07:25PM UTC

IE doesn't create elements using $('<tag>') syntax

Reported by: marioestrada Owned by:
Priority: major Milestone: 1.3.1
Component: core Version: 1.3
Keywords: Cc:
Blocked by: Blocking:
Description

jQuery in IE is not creating the html elements that are being appended to dynamically created elements, both using the $('<tag>') syntax.

This code doesn't work in IE:

paginador = $('<div>').attr('class', 'paginador');

$('.pagina:eq(0)').before(paginador);

btn_fwd = $('<a>').attr({'id': 'btn_fwd', 'href': '#', 'class': 'btn'}).text('>>');

btn_rew = $('<a>').attr({'id': 'btn_rew', 'href': '#', 'class': 'btn'}).text('<<');

paginador.append(btn_rew);

paginador.append(btn_fwd);

This results in IE7 creating the <div> element, but not creating/appending the <a> elements.

To go around this I used:

paginador = $('<div>').attr('class', 'paginador');

$('.pagina:eq(0)').before(paginador);

btn_fwd = $(document.createElement('a')).attr({'id': 'btn_fwd', 'href': '#', 'class': 'btn'}).text('>>');

btn_rew = $(document.createElement('a')).attr({'id': 'btn_rew', 'href': '#', 'class': 'btn'}).text('<<');

paginador.append(btn_rew);

paginador.append(btn_fwd);

And it worked as expected.

Attachments (0)
Change History (4)

Changed January 16, 2009 05:44PM UTC by marioestrada comment:1

doesn't work:

paginador = $('<div>').attr('class', 'paginador');
$('.pagina:eq(0)').before(paginador);
btn_fwd = $('<a>').attr({'id': 'btn_fwd', 'href': '#', 'class': 'btn'}).text('>>');
btn_rew = $('<a>').attr({'id': 'btn_rew', 'href': '#', 'class': 'btn'}).text('<<');
paginador.append(btn_rew);
paginador.append(btn_fwd);

works:

paginador = $('<div>').attr('class', 'paginador');
$('.pagina:eq(0)').before(paginador);
btn_fwd = $(document.createElement('a')).attr({'id': 'btn_fwd', 'href': '#', 'class': 'btn'}).text('>>');
btn_rew = $(document.createElement('a')).attr({'id': 'btn_rew', 'href': '#', 'class': 'btn'}).text('<<');
paginador.append(btn_rew);
paginador.append(btn_fwd);

sorry for not formatting the first time...

Changed January 16, 2009 09:44PM UTC by balazs.endresz comment:2

http://docs.jquery.com/Core/jQuery#htmlownerDocument

"When creating single elements use the closing tag or XHTML format. For example, to create a span use $("<span/>")."

Changed January 17, 2009 03:57AM UTC by dmethvin comment:3

resolution: → invalid
status: new → closed

Works as documented.

Changed October 27, 2011 07:25PM UTC by anonymous comment:4

had the same problem, I had to use var before the variables containing DOM.

var paginador = $('<div />').attr('class', 'paginador');
$('.pagina:eq(0)').before(paginador);
var btn_fwd = $('<a/>').attr({'id': 'btn_fwd', 'href': '#', 'class': 'btn'}).text('>>');
var btn_rew = $('<a/>').attr({'id': 'btn_rew', 'href': '#', 'class': 'btn'}).text('<<');
paginador.append(btn_rew);
paginador.append(btn_fwd);