Puedes hacer eso en javascript,

 const yourSelector = document.getElementById('yourSelector'); yourSelector.addEventListener('change', () => document.querySelector(yourAwesomeElement).style..... // whatever you want )

este código cambiará el css de otro elemento cuando haga clic en cualquier opción del selector.

Mi sugerencia está a continuación: value="@item.QuestionTypeId" que configuré como 1,2,3,4

 <select name="Questions2TypeId" id="questtype"> <option selected="selected" disabled>-- Select --</option> @foreach (var item in ViewBag.questtype) { <option value="@item.QuestionTypeId">@item.QuestionOpenorClose</option> } </select> <p >Click to see the effect.</p> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script> $('#questtype').change(function() { //change click to change color if ( $("option:selected", this).is(':selected')) { //check which option is selected var optionValue = $("option:selected").attr('value'); if(optionValue == 1) { $('p').attr('style','color:blue;') } if(optionValue == 2) { $('p').attr('style','color:red;') } if(optionValue == 3) { $('p').attr('style','color:pink;') } if(optionValue == 4) { $('p').attr('style','color:green;') } } }) </script>

Resultado:

[Nota] Puede consultar: .addClass() .removeClass() para usar $( "p" ).addClass( );o $( "p" ).removeClass( ) de acuerdo con su clase configurada en estilo.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <select id="type"> <option value="item0">--Select an Item--</option> <option value="item1">item1</option> <option value="item2">item2</option> <option value="item3">item3</option> </select> <select id="size"> <option value="">-- select one -- </option> </select>