Code itself

<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12"> <h3><span style="color:#e32636">ТАРИФ</span></h3> <?= $form->field($model, 'tarif')->dropDownList( $model->car_tarif, [ 'prompt'=>'Бесплатно', 'style' => 'width:130px;', ] )->label(false) ?> <div class="form-group"> <!--<li>Спецразмещение: <b class="gold gold_count">нет</b></li>--> <li>Поднятие в ТОП: <b class="gold gold_count">нет</b></li> <li>Выделение цветом: <b class="gold gold_count">нет</b></li> </div> <script> $("select#car-tarif").change(function() { $(".gold_count").html( $("select#car-tarif option:selected").val() == 1 ? '<span style="color:green">На 1 день</span>' : $("select#car-tarif option:selected").text() ); $(".gold_cost_coutn").html( $("select#car-tarif").val() == 1 ? $("select#car-tarif option:selected").text().toLowerCase() : "за " + $("select#car-tarif").val()*<?= Car::COURS ?> + " руб."); }); </script> <hr /> </div>

It is necessary that the first choice (No) it was red, indicated in the styles, and now all the tariffs have turned red, found a way out

 <script> $("select#car-tarif").change(function() { $(".gold_count").html( $("select#car-tarif option:selected").val() == 1 ? '<span style="color:green">На 1 день</span>' : $("select#car-tarif option:selected").text() ); $(".gold_cost_coutn").html( $("select#car-tarif").val() == 1 ? $("select#car-tarif option:selected").text().toLowerCase() : "за " + $("select#car-tarif").val()*<?= Car::COURS ?> + " руб."); }); </script>

But then you have to write every time a new tariff appears, you can do so

 $(".gold_count").html( $("select#car-tarif option:selected").val() >= 1 ?

But then everything automatically gives out "For 1 day"

 '<span style="color:green">На 1 день</span>'

What is there to prescribe that he took the name automatically? because text = tariff name

    1 answer 1

    CSS (first tariff makes it red):

     div.form-group li:first-child b { color: red; }