TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'

Question

I want to append an existing div to have a particular design along with an error message extracted out of an array.

This was my attempt:

    if (data.errors.firstName) {
        document.getElementById("firstName").classList.add("has-error");
        document.getElementById("firstName-group").appendChild('<div class="help-block"> </div>');
    }

But it resulted in an error:

TypeError: Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'.

Which after researching means that is a string which I can add in as it is not a valid dom node.

How can I do this properly?

Answer 1

Your function is returning a string rather than the div node. appendChild can only append a node

var d= document.createElement("div");
d.classList.add("help-block");
document.getElementById("firstName-    group").appendChild(d);