Adding "*" to input Placeholder using CSS

Question

Not able to add Asterisk before Placeholder even using placeholder definition Demo is Given Below

HTML:

<input type="text" placeholder="Asterisk Before Placeholder"/>

CSS:

input::-webkit-input-placeholder:before {
  content: '*';
}
input:-moz-placeholder:before { /* Firefox 18- */
  content: '*'; 
}
input::-moz-placeholder:before {  /* Firefox 19+ */
  content: '*';
}
input:-ms-input-placeholder:before {  
  content: '*';
}

See the JSFiddle

Answer 1

Please try this using Javascript:

var asterisk = "* ",
    inputList = document.getElementsByTagName("input");

for(i=0; i < inputList.length; i++) {
     inputList[i].placeholder = asterisk.concat(inputList[i].placeholder);
}