Javascript created Checkbox does not close off tag properly

Question

If I create a checkbox like this, and add it to my table [TD] tag :

var chkBx = document.createElement('input');
chkBx.type = 'checkbox';

td.appendChild(chkBx);

it will create

<tr>
    <td>
        <input type="checkbox" value="Current Issue">
    </td>
</tr>

This input tag has not been closed off propertly. This is causing problems elsewhere in my code (for example the hover doesnt work).

Is there something i need to do in my Javascript to get this to close off properly?

Answer 1

It depends upon the DOCTYPE you're using. XHTML requires closing tags, HTML doesn't. I think the browser automatically decides whether closing tags are required or not for dynamically created elements, depending on the DOCTYPE.

There also seems to be a problem in the parser on jsfiddle. It doesn't work without a closing tag, although the markup is validated correctly at the W3C validator.