Error: SyntaxError: DOM Exception 12 on Tag Creation Using jQuery
dom, dtd, javascript, jquery, syntax-error
Solution
Make sure you have jQuery loaded in your first example.
Even if you don't have jQuery loaded, the function `$()` is now defined by Google Chrome as something similar to `querySelectorAll()`.
This function only accepts a CSS selector as parameter and not arbitrary HTML like jQuery's `$()`.
From the docs:
SYNTAX_ERR code 12 In invalid or illegal string has been specified; for example setting the selectorText property of a CSSStyleRule with an invalid CSS value.
The function is expecting a CSS selector and you gave it HTML so it gave a syntax error.
See this fiddle, it works just fine:
http://jsfiddle.net/S6d6w/
Problem
I have the following javascript: ``` var orderItemQuantity = $('<input/>', { type: 'hidden', name: 'order_detail[][quantity]', value: itemQuantity }); ``` The above javascript throws the following error message: ``` Error: SyntaxError: DOM Exception 12 ``` This one works without error: ``` var newListItem = $('<li/>', { html: $('#item_name_'+itemId).text() + '(' + $('#item_quantity_' + itemId).val() +')' + '<a onclick="removeItem(' + itemId + ')">Delete this</a>' + '<input type="hidden" name="order_detail[][item_id]" value="' + itemId + '"/>', id: itemId }); ``` I checked the following question but the answer did not specify clearly the correct reason WHY. Here is my DTD: ``` <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ``` Question: Why does `$('<input/>')` and `$('<input>')` throw the said exception while `$('<li/>')` is not a problem?