CODEWITHSUNDEEP
jquerycssjquery-select2
Björn C
Björn C

Reputation: 4008

Set select2 placeholder color with Jquery

So this is how to set the color with Css:
.select2-container--default .select2-selection--single .select2selection__placeholder {color: #444;}

But how can i change the color with Jquery using "this"?

$(this).css('color', 'red') Don't work.
$(this)[0].css('color', 'red') Don't work.
$(this[0]).css('color', 'red') Don't work.

EDIT
console.log( $this) )
0:select#employment.form-control.select2.req_place

Upvotes: 1

Views: 3510

Answers (2)

Vladislav Nosenko
Vladislav Nosenko

Reputation: 641

You can also use this: 

.select2-search__field::placeholder{
    color: #cecfd0;
}
.select2-search__field:-ms-input-placeholder {
    color: #cecfd0;
}
.select2-search__field::-ms-input-placeholder {
    color: #cecfd0;
}

Upvotes: 2

Rajshekar Reddy
Rajshekar Reddy

Reputation: 19007

Since your $(this) shows that it is a select element. You need to find its sibling .select2-container which is what is shown on the UI. And within this sibling find .select2-selection__placeholder and change its color.

So use this code.

$(this).siblings('.select2-container').find('.select2-selection__placeholder').css('color', 'red');

Upvotes: 3

Related Questions