<!--Creating Form -->
<center style="font-size:50px"><form id="myForm">
<input type="text" id="myInput">
<button type="submit">Submit</button>
</form>
<p id="myList">Your Submited Text: </p>
</center>
//Get reference by Id to the form, text input, & p tag
const form = document.getElementById('myForm');
const input = document.getElementById('myInput');
const list = document.getElementById('myList');
//Add event listener form submit
form.addEventListener('submit', (event) => {
event.preventDefault(); // Prevent form submission
list.innerHTML = "Your Submited Text :" + input.value // display value in <p>
input.value = ' ' //clear data
input.focus() //cursor focus
});
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.