esta es una pregunta clásica pero no puede encontrar el mejor enfoque. Tengo un menú desplegable con id project_billing_code_id y 3 valores (1, 2, 3).

Si el valor seleccionado = 1, muestra div con id uno y solo este. div dos y tres deben estar ocultos. También quiero que esto suceda cuando se cargue la vista, así que no solo en el cambio.

$(document).ready(function() {
  $("#hourly").hide();
  $("#per_diem").hide();
  $("#fixed").hide();
$("#project_billing_code_id").change(function() {
  if ($("#project_billing_code_id").val() == '1') {
   $("#hourly").show();
   }
  else if ($("#project_billing_code_id").val() == '2') {
   $("#per_diem").show();
   } 
  else if ($("#project_billing_code_id").val() == '3') {
   $("#fixed").show();
   }
  else { 
       $("#hourly").hide();
       $("#per_diem").hide();
       $("#fixed").hide();
       }
  });
});