title: Error: SyntaxError: DOM Exception 12 on Tag Creation Using jQuery
body: <p>I have the following javascript:</p>
  
  <pre><code>var orderItemQuantity = $('&lt;input/&gt;', {
      type: 'hidden',
      name: 'order_detail[][quantity]',
      value: itemQuantity
  });
  </code></pre>
  
  <p>The above javascript throws the following error message:</p>
  
  <pre><code>Error: SyntaxError: DOM Exception 12
  </code></pre>
  
  <p>This one works without error:</p>
  
  <pre><code>var newListItem = $('&lt;li/&gt;', {
      html:
      $('#item_name_'+itemId).text() +
      '(' + $('#item_quantity_' + itemId).val() +')' +
      '&lt;a onclick="removeItem(' + itemId + ')"&gt;Delete this&lt;/a&gt;' +
      '&lt;input type="hidden" name="order_detail[][item_id]" value="' + itemId + '"/&gt;',
      id: itemId
  });
  </code></pre>
  
  <p>I checked the following <a href="https://stackoverflow.com/questions/13950930/error-syntax-err-dom-exception-12">question</a> but the answer did not specify clearly the correct reason WHY.</p>
  
  <p>Here is my DTD:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  </code></pre>
  
  <p><strong>Question</strong>: Why does <code>$('&lt;input/&gt;')</code> and <code>$('&lt;input&gt;')</code> throw the said exception while <code>$('&lt;li/&gt;')</code> is not a problem?</p>