Change placeholder text

Question

How can I change the placeholder text of an input element?

For example I have 3 inputs of type text.

<input type="text" name="Email" placeholder="Some Text"> <input type="text" name="First Name" placeholder="Some Text"> <input type="text" name="Last Name"placeholder="Some Text"> 

How can I change the Some Text text using JavaScript or jQuery?

Answer 1

If you wanna use Javascript then you can use getElementsByName() method to select the input fields and to change the placeholder for each one... see the below code...

document.getElementsByName('Email')[0].placeholder='new text for email'; document.getElementsByName('First Name')[0].placeholder='new text for fname'; document.getElementsByName('Last Name')[0].placeholder='new text for lname'; 

Otherwise use jQuery:

$('input:text').attr('placeholder','Some New Text'); 

Answer 2

This solution uses jQuery. If you want to use same placeholder text for all text inputs, you can use

$('input:text').attr('placeholder','Some New Text'); 

And if you want different placeholders, you can use the element's id to change placeholder

$('#element1_id').attr('placeholder','Some New Text 1'); $('#element2_id').attr('placeholder','Some New Text 2');