Error con array global de PHP en JavaScript

[jrob_olbaid]

Buen dia.

Otra vez pidiendo ayuda pero no encuentro solucion a un problema!

Creo un array global en php:

Código PHP:

  $HorasApartados= array ("08:00","09:00","10:00","11:00","12:00","01:00","02:00","03:00","04:00","05:00","06:00");  
   

Despues creo una funcion donde modifico algunos valores de este arreglo:

Código PHP:

  function HorasLibres($HorasOcupadas){ 
         
        global $HorasApartados; 
         
        for ($i=0; $i<sizeof($HorasApartados);$i++){ 
            for($j=0; $j<sizeof($HorasOcupadas);$j++){ 
                if ($HorasOcupadas[$j] == $HorasApartados[$i]){ 
                     $HorasApartados[$i]= "OCUPADO"; 
                } 
            } 
        } 
    }  
   

Si la hora esta ocupada segun la BD el valor de arreglo se cambia por "OCUPADO", todo funciona correctamente hasta aqui!

El problema es cuando llego a javascript y quiero mostar la posicion del arreglo, suponiendo que se es ocupado... me muestra la hora del arreglo original y no el ocupado:

Suponiendo que el arreglo esta asi despues de cambiarlo con el metodo anterior:

Código PHP:

  $HorasApartados= array ("OCUPADO","09:00","10:00","11:00","12:00","01:00","02:00","03:00","04:00","05:00","06:00");  
   

Código PHP:

 <script> 
    function validaHoras(){ 
           var arreglo_horarios = new Array (); 
           arreglo_horarios[0]= "<?echo $HorasApartados[0];?>"; 
       alert("Hora seleccionada "+arreglo_horarios[0]) 
    } 
</script>  

Y en php si imprimo $HorasApartados[0], si me pone "OCUPADO"...

Es posible hacer esto en la misma pagina o tengo que validar en otra?? u.u

Gracias por su atencion