Creating a <br /> with javascript createElement?

The first method does not need to pass XHTML standards - you're confusing markup with manipulating the DOM.

The first option will work and has nothing to do with XHTML since the DOM operations are performed after parsing of the document, and therefore there is no XHTML/HTML standard to be compliant to at that point. As long as you are not trying to output the HTML to a string, this approach will work just fine.

A Simple Script of HTML and JavaScript to add br tag dynamically in the page.

 <SCRIPT language="javascript">
    function add() {

     //Create an input type dynamically.
        var br = document.createElement("br");
        var foo = document.getElementById("fooBar");
        foo.appendChild(br);
    } 
    </SCRIPT>

    <INPUT type="button" value="Add" onclick="add()"/>
    <span id="fooBar">&nbsp;</span>

    This text will go down every time you click on add button