How do I get the ID text of the checked item in the select element?

Question

How do I get the ID text of the checked item in the select element?

I need it to change the color of a text, so for example one id could be "red".

<script>
function add(){
    var str = document.getElementById("item");
    str.style.color = ;
}
</script>

Basically I named the id's in the option's as "red", "yellow" and "blue" so I need something to get those id's as text and add it after str.style.color = .

Answer 1

I have tried using jquery.

In this "my_select" is the selector in this. you can get that full element by :selected

$("#my_select").change(function() {
var id = $(this).children(":selected").attr("id");
});

you can get full element by this keyword. try to by log

$("#my_select").change(function() {
console.log(this);
});

after getting full element u can do anything with it like changing color or bold etc.