JQuery removeClass() при нажатии

Question

Привет, у меня есть эта проблема: я хочу нажать на div, который перевернет (это будет работа), но следующий шаг - это flipp div back on click on «x» (это моя проблема).

HTML код:

<div class="col-md-4"> 
    <div class="balik"> 
     <div class="panel panel-default panel-cube"> 
      <div class=" flip"> 
       <div class="card"> 
        <div class="panel-body face front"> 
         <h4>Balík 28 dní</h4> 
         <br> 
         <h1>16,80€</h1> 
         <br> 
         <h4>Zisti viac o balíku &raquo;</h4> 
        </div> 
        <div class="panel-body face back"> 
         <p class="close">x</p> <a href="#"><h4>O Balíku 28 dní</h4></a> 
         &raquo; celkom 28 dní na topovanie 
         <br />&raquo; 5 topovaných inzerátov 
         <br />&raquo; -30% z ceny oproti balíku 7 dní 
         <br /> 
         <br> 
         <button class="btn btn-success"><i class="fa fa-shopping-cart"></i> Kúpiť</button> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

код JQuery:

$(function(){ 
$('.flip').click(function(){ 
    $(this).find('.card').addClass('flipped') 
    });// this is work 

$('.close').click(function(){ 
     $('.flip').find('.card.flipped').removeClass('flipped') 
    }); // this is not work 
}); 

Спасибо за ответы.

Answer 1

Поскольку .flipped является по существу является динамически созданный элемент, вам нужно использовать событие делегация:

http://jsfiddle.net/isherwood/7Zg92/

$(document).on('click', '.close', function() { 
    $('.flip').find('.card.flipped').removeClass('flipped') 
}); 

Answer 2

Это потому, что события пузыриться, вы должны остановить распространение события:

$('.close').click(function(event) { 
    event.stopPropagation(); 
    $('.flip').find('.card.flipped').removeClass('flipped'); 
}); 

http://jsfiddle.net/aaLUs/