Hi preethigowda0,
Refer below sample code.
HTML
<style type="text/css">
body { font-family: Arial; font-size: 10pt; }
table { border: 1px solid #ccc; }
table th { background-color: #F7F7F7; color: #333; font-weight: bold; }
table th, table td { padding: 5px; border-color: #ccc; }
</style>
<table>
<tr>
<td>
<input id="btnCheckIn" type="button" value="Check In" onclick="GetCurrentDateTime('lblCheckIn')" /></td>
<td><span id="lblCheckIn"></span></td>
</tr>
<tr>
<td>
<input id="btnCheckOut" type="button" value="Check Out" onclick="GetCurrentDateTime('lblCheckOut')" /></td>
<td><span id="lblCheckOut"></span></td>
</tr>
</table>
<script type="text/javascript">
function GetCurrentDateTime(elementId) {
var today = new Date();
var day = String(today.getDate()).padStart(2, '0');
var month = String((today.getMonth() + 1)).padStart(2, '0');
var year = today.getFullYear();
var hour = String(today.getHours()).padStart(2, '0');
var minute = String(today.getMinutes()).padStart(2, '0');
var second = String(today.getSeconds()).padStart(2, '0');
var date = day + '/' + month + '/' + year;
var time = hour + ":" + minute + ":" + second;
document.getElementById(elementId).innerHTML = date + " " + time;
}
</script>
Demo