Question

I’m using XHTML 1.0 Strict Document type.
I have at the end of my page some JavaScript:

$.each(x, function(k, v){
    txt += '<li>';
    txt += '<strong>' + v.description     + '</strong>: $' + v.postage;
    txt += '</li>';

When I validate my document on the W3.org, it gives me the following error:

txt += '<ul><li>';
✉

The element named above was found in a context where it is not allowed. This could mean that you have incorrectly nested elements —
such as a “style” element in the “body” section instead of inside
“head” — or two elements that overlap (which is not allowed).

One common cause for this error is the use of XHTML syntax in HTML documents. Due to HTML’s rules of implicitly closed elements, this
error can create cascading effects. For instance, using XHTML’s
“self-closing” tags for “meta” and “link” in the “head” section of a
HTML document may cause the parser to infer the end of the “head”
section and the beginning of the “body” section (where “link” and
“meta” are not allowed; hence the reported error).

I am a very beginner in JavaScript, it would be very nice if someone can help me to fix this validation error on my page.

Answer 1

The reason is that you’re in an inline script element that’s still parsed by the XML parser (in theory). Your tags inside the JavaScript strings might be counted as elements.

One solution (the best solution, which you should be doing already) is to simply move your JavaScript into an external file and link to it:

<script type="text/javascript" src="my/script.js"> </script>

The other ones involve escaping or using <![CDATA[ blocks, and are generally unpleasant.