Cannot figure out why appendChild is returning undefined
<p>I cannot figure out why <code>appendChild</code> is returning undefined.</p>

<p>I also tried <code>t.previousSibling.appendChild(document.createElement('span'));</code> which returns "previousSibling undefined".</p>

<p>I need to add a span element with class of "error" to the span, withing the textnode of the label. So I loop through all the inputs and look for one that is empty, if it's empty, it should add "*required" message next to the input label. I've got lots of ideas, but not sure where the problem lies. THANKS for your help!</p>

<pre><code>var obj = {

inputs: document.getElementsByTagName("input"),
btn: document.getElementById('submit'),

init : function() {

    obj.btn.onclick = obj.submitForm();

    },

submitForm : function() {


    for (var i=0; i&lt;obj.inputs.length; i++) {

        if (obj.inputs[i].value==="") {

        switch(obj.inputs[i].name) {

            case "fname" : match=true; obj.error("fname");
            case "lname" : match=true; obj.error("lname");

            }   
        }
    }
},


error : function(t) {

        var err = "*required";
        var j = t.previousSibling.appendChild(document.createElement('span'));
        j.className = "error";
        j.appendChild(document.createTextNode(err));

    }   
}


Here is HTML: 

&lt;head&gt;
&lt;title&gt;Homework 9 JavaScript form&lt;/title&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;form method="post" action=""&gt;
&lt;div&gt;
&lt;ul&gt;
&lt;li&gt;&lt;label&gt;First Name&lt;/label&gt;&lt;input type="text" id="fname" name="fname" size="30"  /&gt;&lt;/li&gt;
&lt;li&gt;&lt;label&gt;Last Name&lt;/label&gt;&lt;input type="text" name="lname" size="30"  /&gt;&lt;/li&gt;
&lt;li&gt;&lt;label&gt;Phone&lt;/label&gt;&lt;input type="text" name="phone" size="30"  /&gt;&lt;/li&gt;
&lt;li&gt;&lt;label&gt;Email&lt;/label&gt;&lt;input type="text" name="email" size="30" /&gt;&lt;/li&gt;
&lt;li&gt;&lt;input type="submit" name="submit" id="submit" value="Submit" /&gt;
&lt;/ul&gt;
&lt;/div&gt;
&lt;/form&gt;
&lt;script type="text/javascript" src="hw9.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;obj.init();&lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
