How to reset placeholder value

How to reset placeholder value


This is seems pretty simple but I’ve failed to do it.

Let’s say I have an input element with a place holder of “Final Score”, so something like this:

<input type="text" placeholder="Final score" class="final-score">

If the user types a value and then click certain button, I want to reset the placeholder to its original state, meaning I’d like to delete the value the user typed in the input.

I’ve tried this but none worked:

element.addEventListener('click', () => document.querySelector('.final-score').textContent = 'Final Score');

element.addEventListener('click', () => document.querySelector('.final-score').defaultValue);

Any help is greatly appreciated, thanks.



document.querySelector('.final-score').value = '';

Feel free to delete the post or just leave it here for others that might have the same doubt in the future.