jquery html doesn't add the entire string

Question

I found a weird behavior of jquery's html function.

I have the following code snippet.

HTML

<div id='content'></div>

Javascript

var test2 = "<h5>test(S)</h5><span class='small_text>Apr 20, 2012 @ 07:00PM<br />Section 102 Row G Seat 14-14<br />";

$(document).ready(function(){

    $("#content").html(test2);

});

When I run the code, it can only see 'test(S)'. It looks jquery ignores the rest of the string.

I created a jsfiddle.

http://jsfiddle.net/E3X33/

Am i using it incorrectly? or is there a undocumented stuff...?

Gabe · Accepted Answer · 2012-04-20 21:50:06Z

5

You're not closing the <span> tag, plus closing quote of the class attribute

Should be:

var test2 = "<h5>test(S)</h5><span class='small_text'>Apr 20, 2012 @ 07:00PM<br />Section 102 Row G Seat 14-14<br /></span>";

answered Apr 20, 2012 at 21:50

Gabe

50.6k29 gold badges147 silver badges182 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

anson Over a year ago

also the closing single quote in the class attr

user400654 Over a year ago

The closing single quote is the bigger of the two problems. Most browsers can handle the non-closed span tag.

Will Morgan · Accepted Answer · 2012-04-20 21:51:49Z

2

Yes and no. Your jQuery syntax is correct but your HTML is not.

Try this:

<h5>test(S)<\/h5><span class='small_text'>Apr 20, 2012 @ 07:00PM<br \/>Section 102 Row G Seat 14-14<br \/><\/span>

You needed to:

Close your class attribute on the span tag.
Close the span tag itself.
Escape forward slashes for safety in bad browsers.

answered Apr 20, 2012 at 21:51

Will Morgan

4,5005 gold badges31 silver badges42 bronze badges

Comments

calebds · Accepted Answer · 2012-04-20 21:51:52Z

2

Try closing your span tag and closing ' for span class:

var test2 = "<h5>test(S)</h5><span class='small_text'>Apr 20, 2012 @ 07:00PM<br />Section 102 Row G Seat 14-14<br /></span>";

DEMO

answered Apr 20, 2012 at 21:51

calebds

26.3k9 gold badges51 silver badges75 bronze badges

Collectives™ on Stack Overflow

jquery html doesn't add the entire string

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related