JSFiddle - React, Tailwind, and code Playground
HTML
<input id="new1" type="button" value="new (method1)" />
<input id="new2" type="button" value="new (method2)" />
<input id="new3" type="button" value="new (method3)" />
JavaScript
function elementClass({htmlType = "", cssClass = "", text = "", value = "", id = "", ...rest}) {
return {htmlType, cssClass, text, value, id, ...rest}
}
function showElement(element) {
var message = "";
for (key in element) {
message = message + 'key: ' + key + ' ' + 'value: ' + element[key] + '\n';
}
alert(message);
}
$('#new1').click(function() {
var newElement1 = new elementClass({htmlType:"div",cssClass:"form-group",id:"div1", otherData:123});
showElement(newElement1);
});
$('#new2').click(function() {
var newElement2 = new elementClass("div", "form-group", "undefind", "undefind", "div1");
showElement(newElement2);
});
$('#new3').click(function() {
var newElement3 = new elementClass();
newElement3.htmlType = "div";
newElement3.cssClass = "form-group";
newElement3.id = "div1";
showElement(newElement3);
});