Why am I getting this JS error?

Question

This is the error:

Uncaught SyntaxError: Unexpected token ILLEGAL
d.d.extend.globalEvaljquery-1.5.1.min.js:16
d.ajaxSetup.converters.text scriptjquery-1.5.1.min.js:16
bQjquery-1.5.1.min.js:16
vjquery-1.5.1.min.js:16
d.support.ajax.d.ajaxTransport.send.c

Here is the jQuery:

$("div#notif_js").html(' ');

$("div#notification_box").html('<div class="notification">
  <p><img alt="Justin meltzer" class="feed_image_notif" src="/system/photos/46/tiny/Justin Meltzer.jpeg?1303109121" /> JMeltz 
   added a comment to <b>second</b> by <img alt="Justin meltzer" class="feed_image_notif" src="/system/photos/45/tiny/Justin Meltzer.jpeg?1303109101" /> Justin Meltzer</p>
  <a href="/videos/506"></a>
</div>
<div class="notification">
  <p><img alt="Justin meltzer" class="feed_image_notif" src="/system/photos/46/tiny/Justin Meltzer.jpeg?1303109121" /> JMeltz 
   added a comment to <b>second</b> by <img alt="Justin meltzer" class="feed_image_notif" src="/system/photos/45/tiny/Justin Meltzer.jpeg?1303109101" /> Justin Meltzer</p>
  <a href="/videos/506"></a>
</div>
<div class="notification">
  <p><img alt="Justin meltzer" class="feed_image_notif" src="/system/photos/46/tiny/Justin Meltzer.jpeg?1303109121" /> JMeltz 
   added a comment to <b>second</b> by <img alt="Justin meltzer" class="feed_image_notif" src="/system/photos/45/tiny/Justin Meltzer.jpeg?1303109101" /> Justin Meltzer</p>
  <a href="/videos/506"></a>
</div>
<div class="notification">
  <p><img alt="Justin meltzer" class="feed_image_notif" src="/system/photos/46/tiny/Justin Meltzer.jpeg?1303109121" /> JMeltz upvoted bhbu </p>
   <a href="/videos/505"></a>  
</div>      
<div class="notification">
  <p class= "all_notifications">All Notifications</p>
  <a href="/videos/notification_go"></a>
</div>');

Answer 1

Javascript doesn't allow you to have multiple lines inside of your strings. You either need to convert each line into a \n, like so:

$("div#notification_box").html('line1\nline2');

or precede the end of each line with a '\' like so:

$("div#notification_box").html('line1\
line2');

The first method seems to be more commonly used, although the second method looks better in my opinion.

Also, a nice and easy way to check for javascript errors is to run it through a javascript delinter such as http://www.javascriptlint.com/online_lint.php or http://www.jslint.com/ (although jslint doesn't report the error as nicely as javascriptline).

---