title: Expected expression, got end of script
body: <p>So I have the below code in the header of a webpage:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  var counter = 2;
  function addNewItemField(divName) {
    var newDiv = document.createElement("div");
    newDiv.id = "item_listing_" + counter;
    newDiv.innerHTML  = "&lt;label for=\"item_" + counter + "\"&gt;Item: &lt;/label&gt;&lt;br /&gt;";
    newDiv.innerHTML += "&lt;input type=\"text\" id=\"item_" + counter + "_category\" list=\"list_categories\" name=\"items[]\"&gt;";
    newDiv.innerHTML += "&lt;input type=\"number\" id=\"item_" + counter + "_amount\" mine=\"0.00\" step=\"0.01\" value=\"0.00\" name=\"amounts[]\"&gt;&lt;br /&gt;";
    document.getElementById(divName).appendChild(newDiv);
    counter++;
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>I try calling it using a button, however I always get a syntax error stating "expected expression, got end of script."</p>
  
  <p>I've ran it through Linter and it found no errors, I've reviewed it a hundred times and I cannot find where the fault is. I hate to just post code and ask "Why doesn't this work?" but I don't have any idea what's going on so I'm at a loss on even how to ask a proper question for it. </p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>Here is the associated piece of HTML furhter down the page where the function call is made and the peices being manipulated reside:</p>
  
  <pre><code>&lt;div id="item_listings"&gt;
    &lt;div id="item_listing_1"&gt;
      &lt;label for="item_1"&gt;Item: &lt;/label&gt;&lt;br /&gt;
        &lt;input type="text" id="item_1_category" list="list_categories" name="items[]"&gt;
        &lt;input type="number" id="item_1_amount" min="0.00" step="0.01" value="0.00" name="amounts[]"&gt;&lt;br /&gt;
  
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;br /&gt;
  &lt;input id= "add_new_item" type="button" onClick="javascript:addNewItemField("item_listings")" value="Add Another Item"&gt;')
  </code></pre>