Moon
Moon

Reputation: 22565

jquery html doesn't add the entire string

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...?

Upvotes: 1

Views: 57

Answers (3)

calebds
calebds

Reputation: 26228

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>";

Upvotes: 2

Will Morgan
Will Morgan

Reputation: 4490

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:

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

Upvotes: 2

Gabe
Gabe

Reputation: 50493

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>";

Upvotes: 5

Related Questions