Я пытаюсь выяснить, как изменить цвет только одного выбранного элемента, когда он выбран. Я уверен, что это можно сделать с помощью jquery, но я не знаю как. Я хотел бы, чтобы интервал времени 6:00 утра - 9:00 утра стал красным, когда он выбран. Я создал Codepen для тестирования этого: https://codepen.io/JapperCat/pen/mLQjwx
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
</head>
<body>
<div class="">
<label for="reqDeliveryTime"><strong>Requested Delivery Time:</strong>
</label>
<select name="reqDeliveryTime" id="reqDeliveryTime" required data-
hint="Please choose at least one">
<option id="reqDeliveryTime_0" selected value="Choose a Delivery Time"
required>
Choose a delivery time
</option>
<option id="reqDeliveryTime_1" class="text-danger" style="font-weight:bold;"
value="6:00 am - 9:00 am">
6:00 am - 9:00 am
</option>
<option id="reqDeliveryTime_2" value="8:00 am - 12:00 pm">
8:00 am - 12:00 pm
</option>
<option id="reqDeliveryTime_3" value="10:00 am - 2:00 pm">
10:00 am - 2:00 pm
</option>
<option id="reqDeliveryTime_4" value="12:00 pm - 4:00 pm">
12:00 pm - 4:00 pm
</option>
<option id="reqDeliveryTime_5" value="2:00 pm - 6:00 pm">
2:00 pm - 6:00 pm
</option>
</select>
</div> <!-- end of row -->
<script>
$(document).ready(function(){
$("#reqDeliveryTime_1").click(function(){
$(this).css("color", "red");
});
});