Hover sur div

Bonjour à tous,

Etant totalement novice en Javascript, je fais face à une difficulté depuis un petit moment.

J'ai plusieurs blocs (articles), avec à l'intérieur deux class, une visible, l'autre non. Je voudrais lorsque je clique sur une class fair apparaître l'autre mais seulement pour le bloc article en question et non pour l'ensemble des blocs.

<article>
    <div class="bloc_visible"></div>
    <div class="bloc_a_afficher" style="display:none;"></div>
</article>

<article>
    <div class="bloc_visible"></div>
    <div class="bloc_a_afficher" style="display:none;"></div>
</article>

<article>
    <div class="bloc_visible"></div>
    <div class="bloc_a_afficher" style="display:none;"></div>
</article>

Avec la fonction Javascript suivante, lorsque je clique sur la class "bloc_visible" dans l'un des blocs article, toutes les class "bloc_a_afficher" apparaissent, or je souhaite afficher cette class uniquement dans le bloc article en question.

$( ".bloc_visible" ).click(function() {
    $( ".bloc_a_afficher" ).toggle(0);
});

Pourriez-vous m'éclairer sur le sujet.

Par avance merci.