unterminated string literal error when storing dynamic content with javascript

Question

I imagine this has been asked many times but I am having problems with the above error, What I am trying to do is have a cortina effect menu whose child div s content will change depending on a variable which is coming from a drop down menu.

So I wrote roughly how the content of the div would look for one option in a bid to test it out and this is what I have:

function popupContent(selectedText)
{

    return '<div>Operating System:
    <a class="changer">+<\/a><select class="firstSelect">
<option>Windows<\/option>
<option>OSX<\/option>
<option>Linux<\/option>
<\/select>
<\/div>
<div>Releases:<a class="changer">+<\/a><select class="secondSelect"><option>11.0<\/option><option>11.2<\/option>
<option>10.1<\/option>
<\/select>
<\/div>';
}

I set the content of the div using $('#divname').html(popupContent(this.name));

When I try to load the page I get a unterminated string literal error , I have spent some time looking around and most of the questions seem to be when the word script is in it (which I don't have) and escaping / characters which I have tried as you can see.

Can anyone shed some light on this please?

Answer 1

Your string has line breaks in it.

You can do this instead:

return '<div>Operating System:' +
  '<a class="changer">+<\/a><select class="firstSelect">' +
  '<option>Windows<\/option>' +

etc.