ggagosh/html

## html
<!DOCTYPE html>
<html>
    <head>
            <style>
                    table {
                      font-family: arial, sans-serif;
                      border-collapse: collapse;
                      width: 100%;
                    }

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

                    tr:nth-child(even) {
                      background-color: #dddddd;
                    }
                    </style>
    </head>
    <body>
        <h1>Hello</h1>

        <form name="myform" onsubmit="return validateMyForm();">
            <input id="fname" placeholder="First Name" type="text" name="fname">
            <input type="submit" name="Submit" value="submit">
        </form>
        <table>
            <thead>
                <th>First Name</th>
            </thead>
            <tbody id="MaBody">
                <tr>
                    <td>Giorgi</td>
                </tr>
            </tbody>
        </table>
        <script src="code.js"></script>
    </body>
</html>

## js
function validateMyForm()
{
    var nameValue = document.getElementById("fname").value;
    var element = document.getElementById("MaBody");
    var newElement = '<tr><td>'+ nameValue + '</td></tr>'

    element.insertAdjacentHTML( 'beforeend', newElement )

    document.getElementById("fname").value = '';

    return false;
}
	<!DOCTYPE html>
	<html>
	<head>
	<style>
	table {
	font-family: arial, sans-serif;
	border-collapse: collapse;
	width: 100%;
	}

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

	tr:nth-child(even) {
	background-color: #dddddd;
	}
	</style>
	</head>
	<body>
	<h1>Hello</h1>

	<form name="myform" onsubmit="return validateMyForm();">
	<input id="fname" placeholder="First Name" type="text" name="fname">
	<input type="submit" name="Submit" value="submit">
	</form>
	<table>
	<thead>
	<th>First Name</th>
	</thead>
	<tbody id="MaBody">
	<tr>
	<td>Giorgi</td>
	</tr>
	</tbody>
	</table>
	<script src="code.js"></script>
	</body>
	</html>
	function validateMyForm()
	{
	var nameValue = document.getElementById("fname").value;
	var element = document.getElementById("MaBody");
	var newElement = '<tr><td>'+ nameValue + '</td></tr>'

	element.insertAdjacentHTML( 'beforeend', newElement )

	document.getElementById("fname").value = '';

	return false;
	}