Open div by clicking on specific element

Question

I made a foreach in my bank plus the code will be very extensive continuing, What I want to do is for the user to click on the link to appear a directory of a div, in this div will have a link to really delete the article the problem is when I call the confirmation div , the JS calls multiple Divs, I would like the confirmation div appear in the element clicked

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
    $("document").ready(function(){ 
        $('.excluir').click(function(){
            $('.janela-moldal').fadeIn();
         });

        $('.chamar-moldal').click(function(){
            $('.janela-moldal').fadeIn();
        });

        $('.cancelar').click(function(){
            $('.janela-moldal').fadeOut();
        });

        $(".excluir-artigo").live('click',function(){
             $.post('php/deletar.php', {coment:$(this).attr('id')});
             $(this).parent('div').fadeOut();
             $(".janela-moldal").fadeOut();
        };
    });
});
</script>

<?php
    $artigo[] = array();
    $artigo['artigo_id'] = 1;
    $artigo['frase'] = '"A vingança nunca é plena, mata a alma e a invenena"';

    var_dump($artigo);
?>

  <div class="artigos" id="artigos"> 
      <?=$artigo['artigo_id']; ?>
      <h1><?= $artigo['frase']; ?></h1>
      <a class="chamar-moldal" href="javascript:void(0);">chamar a div de confirmacão </a>
  </div>

   <div class="janela-moldal" style="display:none"> 
       <h1>Deseja excluir este artigo?</h1>
            <a class="cancelar" href="javascript:void(0);">cancelar</a>
            <a class="excluir-artigo" id="artigo-<?=$artigo['artigo_id']?>" href="javascript:void(0);">excluir</a>
   </div>       

Answer 1

If you can, use the Bootstrap Small Modal.

It is elegant, and very simple to implement.