Ocultar div al rellenar un input de un formulario

[mensajeescrito]

Hola amigas/os, de nuevo con un problema que no se en que estoy fallando.

Veran tengo un formulario que debe mostrar por defecto un div, y cuando se rellene

el input "nombre" (y no cuando se haga solo click en el input), entonces este div debe ocultarse.

Logicamente cuando el input se le borrara el contenido escrito en el, dicho div debería aparecer

de nuevo.

Este es mi codigo:

Código Javascript:

var miClaseValidar = {
                            
            obligatorios: function() 
            
                {   
                    var nombre = document.getElementById("nombre").value;
                    
                    var advertencia = document.getElementById("advertencia");
            
            
            
                    if (nombre == null || nombre.length == 0 || /^\s+$/.test(nombre)) 
                    
                        {          
                           advertencia.style.display = 'block';
                        }
                        
                        else
                        
                        {
                            advertencia.style.display = 'none';
                        }
                }
        }
 

Código HTML:

<form action="index.php" method="post" onsubmit="return miClaseValidar.obligatorios();">
            
            <input type="text" name="nombre" id="nombre" placeholder="nombre" onclick="return miClaseValidar.obligatorios(this);">
          
            <div id="advertencia"><img style="width:30px; height:30px;" src="imgs/icono_facebook.png"></div>
 
            <input type="submit" name="enviar" id="enviar" value="enviando">             
 
        </form>
 

Cualquier ayuda seria de agradecer