Nascondere i div dei genitori in Jquery

Question

Ho una semplice struttura div (vedi sotto). Tutto quello che sto cercando di fare è quando viene cliccato il div id "intervistatore-Button" i seguenti div dovrebbero apparire e quando il div id "elt" viene cliccato div da id "parent0" fino alla fine dovrebbe nascondersi.

La parte di visualizzazione funziona correttamente. Tuttavia, quando provo a nascondermi, NON si nasconde. Quando clicco sul div id "elt" viene lanciato il messaggio di avviso "hh" (vedi sotto) !! Strano. Qualche aiuto su come nasconderlo?

<div id = "interviewer-Button"> 
    Interviewer 
    <div id = "parent0"> 
     Viv 
      <div id = "parent1"> 
       Parent 
       <div id = "elt"> 
        Close 
       </div> 

      </div>           
    </div>                
</div>  


<script> 
$(document).ready(function() { 
    $("#parent0").hide(); 
    $("#interviewer-Button").click(function() { alert("hh");$("#parent0").show(); }); 
    $("#elt").click(function() { 
      $(this).parent().parent().hide(); 
     });     
    }); 
</script> 

Answer 1

È necessario interrompere la propagazione dell'evento click nel gestore per l'elemento interno. Senza di ciò verrà invocato anche il gestore per il genitore. Vedi lo jQuery event object per maggiori informazioni.

$("#elt").click(function (e) { 
    e.stopPropagation(); 
    $(this).parent().parent().hide(); 
}); 

Answer 2

n/aUsato una combinazione di quanto sopra. Grazie a entrambi i membri per le loro risposte. grande aiuto.

  jQuery(function ($) { 
       $('.coffee-strength p span').each(function() { 
        var string = $.trim($(this).text()); 
        if(string!="22"){ 
         $(this).html('<img src="/images/' + string + '.png" alt="' + string + '" />'); 
        }else{ 
         $(this).parent().parent().hide();  
        } 
        }); 

      }); 

      </script> 

Answer 3

È possibile inoltre usufruire di propagazione degli eventi e allegare un solo evento:

$(function() { 
    $("#parent0").hide(); 
    $("#interviewer-Button").on('click', function(e){ 
    $(this).find('#parent0').toggle(e.target.id !== 'elt'); 
    }); 
});