¿Es correo usar id y class en las etiquetas section, article,etc?

[dual3nigma]

Wow pero que demonios!!!! Para empezar tu código es "semánticamente incorrecto" y contradictorio. Si es una nota por que es habrías de utilizar un article :S jajaja

Mira deberías de tener algo asi:

Código HTML:

<section>
    <h1 />
    
    <article />
    <article />
</section>
 

Por otro lado, wtf por que querrias hacer click en el header jaja, nome imagino que clase de sitio es ese, no quisiera entrar.

Ahora respecto al css más bien sería algo asi:

Código CSS:

section:nth-of-type(1) article:first-of-type {
    color: red;
}
 
section:nth-of-type(2) article:first-of-type {
    color: blue;
}
 

Es más limpio, más claro. Es una buena práctica.

y en javascript lo mismo

Código Javascript:

document.querySelector('section:nth-of-type(1)').style.display = 'none'
 

Aunque más bien quieres usar un framework:

Código Javascript:

jQuery('section').first().hide()
 

Se que va a salir por ahi el que diga que por id es más rapido, pero ya no vivimos en 1990 y querySelector es casi igual, no es que hay una diferencia gigante entre los dos, cada vez menos. Lo que si es que como decia las malas practicas son las que lo arruinan todo, fijate que pesimo eso que haces en tu codigo javascript, en tu "funcionx" estas haciendo un getElementById en vez de tener algo asi:

Código Javascript:

(function () {
    var x = document.querySelector('section:nth-of-type(1)');
    
    function funcionx() {
        x.style.display = 'none';
    }
}());
 

Asi que cuidado!!!

Saludos.