Tenho duas div. Estou tentando fazer o seguinte. Quando eu clicar na div pai ele deve retornar o alert. Mas quando eu clicar na div filho nada deve acontecer. Tentei algo abaixo, mas não tive sucesso.
Eu sei que não funcionou porque ele está chamando dois eventos, o da div pai, e o da div filho. Mas não sei como impedir que ele não chame o evento da div pai ao clicar na div filho.
Exeste alguma forma simples de fazer isso com jQuery?
$('.pai, .filho').click(function(){
if($(this).attr('class') == 'pai') {
alert('teste');
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="pai">
Pai
<div class="filho">Filho</div>
</div>