Ritardo in Javascript

[mimo84]

Ciao a tutti, sto cercando di realizzare uno script che faccia cambiare colore ad un elemento con un ritardo di x millisecondi. Ho provato prima con il metodo delay di jquery e quindi con il setTimeout proprio di JS. Qualcuno di voi mi saprebbe aiutare?
Questo è il codice con setTimeout

<div id="ciao"> ciao ciao ciao </div> 
<script> <div id="ciao">
ciao ciao ciao
</div>
<script>
    $(document).ready(function() {
        
        setTimeout($('#ciao').css("color","green"),400);
        setTimeout($('#ciao').css("color","red"),400);

    });
</script> 

Questo con il delay

<script>
    $(document).ready(function() {
        
        $('#ciao').css("color","green").delay(400).css("color","red");

    });
</script> 

La scritta si vede soltanto rossa