I just started playing around with Mozilla Jetpack, and I love it so far. I wrote a little code that displays an icon in the statusbar that, when clicked, brings up a notification:

var myTitle = 'Hello World!';
var line1 = 'I am the very model of a modern Major-General,';
var line2 = 'I\'ve information vegetable, animal, and mineral,';
var line3 = 'I know the kings of England, and I quote the fights historical,';
var line4 = 'From Marathon to Waterloo, in order categorical.';
var myBody = line1 + ' ' + line2 + ' ' + line3 + ' ' + line4;
var myIcon = 'http://www.stackoverflow.com/favicon.ico';

jetpack.statusBar.append({
  html: '<img src="' + myIcon + '">',
  width: 16,
  onReady: function(doc) {
    $(doc).find("img").click(function() {
      jetpack.notifications.show({title: myTitle, body: myBody, icon: myIcon});
    });
  }
});

Because the text is very long in this example, the notification looks like this:

Jetpack Notification http://img33.imageshack.us/img33/7113/jetpack.png

I want to split the text of the notification onto four different lines when they are displayed so the notification box is taller and narrower. How do I go about doing this?

Edit 1 (Thanks to Rudd Zwolinski):

I tried, but this does not help:

var myBody = line1 + '\n' + line2 + '\n' + line3 + '\n' + line4;

Edit 2 (Thanks to Ólafur Waage):

This does not help either:

var myBody = line1 + '<br />' + line2 + '<br />' + line3 + '<br />' + line4;

Edit 3 (Thanks to javascript jquery firefox-addon firefox-addon-sdk

Edit
Report