Add elements to DOM through pure javascript

CSS

.div1{
    width: 300px;
    height: 100px;
    border: 1px solid red;
}

.div2{
    width: 300px;
    height: 50px;
    border: 1px solid green;
    background-color: gray;
}

span{
    width:200px;
    height: 50px;
    background-color: yellow;
}

JavaScript

var div = document.createElement("div");
div.setAttribute("class", "div1");






div.appendChild(innerDiv);
document.body.appendChild(div);

var p = document.createElement("p");
var t = document.createTextNode("this is a paragraph.");
p.appendChild(t);
document.body.appendChild(p);