JSFiddle - React, Tailwind, and code Playground
JavaScript
function Elm(name, attributes, children){
var elm = document.createElement(name);
for(var attributeName in attributes ){
var attributeValue = attributes[attributeName];
elm.setAttribute(attributeName, attributeValue);
}
for(var i in children ){
elm.appendChild(children[i]);
}
return elm;
}
function Text(nodeValue){
return document.createTextNode(nodeValue);
}
var message = "Hello Vanilla JS";
var input = Elm("input",{ "value" : message },[]);
var text = Text(message);
var view = Elm("div",{ "class" : "block" }, [
input,
Elm("p",{}, [text])
]);
input.addEventListener("keyup",function(e){
text.nodeValue = input.value;
});
input.addEventListener("keydown",function(e){
text.nodeValue = input.value;
});
document.body.appendChild(view);