I think it's similar to this question, but my problem is about jQuery and HTML5. I'm adding a <LI> element to <UL> and links (<a href="..">) added inside apears as plain text, not clickable. Besides that, images are not visible, while <img src=".."> elements are being added propertly.

Looks like I need some "refresh" trick to do after using append(). Which one?

This is my code, just in case:

$('ul').append($('<li/>').append($('<img/>').attr('src', '')));

The image is not visible, while HTML is being build correctly. I'm trying in Safari 5.1 on Mac.

BTW, everything works perfectly fine in Firefox 10.0. Maybe the actual problem is that I'm using XML+XSL formatting in Safari and plain HTML5 in Firefox..

I think it's similar to this question, but my problem is about jQuery and HTML5. I'm adding a <LI> element to <UL> and links (<a href="..">) added inside apears as plain text, not clickable. Besides that, images are not visible, while <img src=".."> elements are being added propertly.

Looks like I need some "refresh" trick to do after using append(). Which one?

This is my code, just in case:

$('ul').append($('<li/>').append($('<img/>').attr('src', 'http://example.')));

The image is not visible, while HTML is being build correctly. I'm trying in Safari 5.1 on Mac.

BTW, everything works perfectly fine in Firefox 10.0. Maybe the actual problem is that I'm using XML+XSL formatting in Safari and plain HTML5 in Firefox..

• javascript
• jquery

Share Improve this question Follow edited May 23, 2017 at 12:19 CommunityBot 111 silver badge asked Mar 23, 2012 at 4:01 yegor256yegor256 105k131131 gold badges463463 silver badges626626 bronze badges 5

• Not 100% sure about how append works, but to me it looks like you are appending the image outside of the li (directly under the ul). And does not attr need an attribute name (like src)? Can you check the resulting DOM? – Thilo Commented Mar 23, 2012 at 4:05
• I just corrected my example. The resulting DOM looks perfectly correct. – yegor256 Commented Mar 23, 2012 at 4:10
• is this jQuery mobile? If so, you do need some kind of refresh. – Thilo Commented Mar 23, 2012 at 4:23
• No, it's not jQuery mobile, just jquery 1.7.2 in Safari on Mac – yegor256 Commented Mar 23, 2012 at 4:27
• Anything in the error console? – David Thomas Commented Mar 23, 2012 at 5:52

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

This is how it works instead (see this question also):

$('#list').html('<li>foo</li>');

This will add an li element with an image in it.

   $("ul").append("<li><img src='http://www.yourimage/normal.JPG' /> </li>"); 

Here is the sample : http://jsfiddle/xchXQ/1/