Highlight text color not background color in textarea

Question

Highlight text color not background color in text area area by using jquery . I dont want background color as highlighted , The letter should get highlighted

If it is about the user selection and not the whole text, then this is probably helpful: [CSS3 - How to style the selected text in textareas and inputs in Chrome?](http://stackoverflow.com/questions/8438418/css3-how-to-style-the-selected-text-in-textareas-and-inputs-in-chrome) — t.niese, Dec 28 '13 at 15:56

score 1 · Answer 1 · answered Dec 28 '13 at 15:54

1

You can set the color of the textarea using .css('color', color) like

$('textarea').css('color', 'red')

Demo: Fiddle

answered Dec 28 '13 at 15:54

Arun P Johny

384,651
66
527
531

score 0 · Answer 2 · answered Dec 28 '13 at 15:57

0

Try this,

CSS:

.Highlighter{     
    color: red;
 }

Jquery:

$('textarea').addClass('Highlighter');

answered Dec 28 '13 at 15:57

Krish R

22,583
7
50
59

score 0 · Answer 3 · answered Dec 28 '13 at 16:07

What i understood is you want to color the the text which is selected by user. I don't think thats possible that way in an input element. I suggest you to use ::selector{} css3 selector with a contenteditable(html5 editable div attribute) div which can be used like text area and you can achieve what you need this way:

::selection{
    color: #ff0000;
}

and your div:

 <div contenteditable='true'>
      This is the dummy content.
 </div>

and here you can play with fiddle.

Highlight text color not background color in textarea

3 Answers3