JSFiddle - React, Tailwind, and code Playground

by Vladimir Timofeev

HTML

<body>
    <div id="content">
    </div>
</body>

CSS

table {
    border-collapse: collapse;
	 float: left;
}

td,
th {
    padding: 5px;
    border: 1px solid #ccc;
    text-align: left;
}

tr{
    background-color: #eeffee;
}

JavaScript

function Student(name, skype, gender, phone, email) {
	this.name = name;
	this.skype = skype;
	this.gennder = gender;
	this.phone = phone;
	this.email = email;
}
var arrayofus = [];

function StudentsList(name, age, gender, phone, email) {
    this.studentToArray = function(name, age, gender, phone, email) {
        var person = new Student(name, age, gender, phone, email); // here we create instance
        arrayofus.push(person);
    }

    this.getLiveForm = function(array) {
        var arraynededkeys = [];
        arrayofus.forEach(function(item, i) {
            var testobj = {};
            for (var key in arrayofus[i]) {
                if (key == 'phone' || key == 'email') {
                    continue;
                } else {
                    testobj[key] = arrayofus[i][key];
                }
            }
            arraynededkeys.push(testobj);
        })
        return arraynededkeys;
    };

    this.getInfoForm = function(array) {
        var arraynededkeys = [];
        arrayofus.forEach(function(item, i) {
            var testobj = {};
            for (var key in arrayofus[i]) {
                if (key == 'name' || key == 'skype' || key == 'gennder') {
                    continue;
                } else {
                    testobj[key] = arrayofus[i][key];
                }
            }
            arraynededkeys.push(testobj);
        })
        return arraynededkeys;
    };
}
function LiveView(data) {

    this.showTable = function(data) {
        var columns = Object.keys(data[0]),
            table = document.createElement('table'),
            thead = document.createElement('thead'),
            tablerow,
            tablehead,
            tbody,
            texttd,
            button;

        table.appendChild(thead);

        tablerow = document.createElement('tr');

        columns.forEach(function(item, i) {
            tablehead = document.createElement('th');
            tablehead.textContent = columns[i];
           ...