在每個循環中選擇div

Question

我在這段代碼中遇到了一些問題。 我的目標是點擊一個隨機的div，然後用內容填寫一個div。

前四次點擊有四種不同的內容。首先點擊 - 內容1;第二次點擊 - 內容2，等等。

問題是，最後填充的內容也填充每隔一個div而不僅僅是選定的一個。

這裏是我的小提琴：https://jsfiddle.net/xamonix/g0go9sgh/

這裏是我的代碼：

$(document).ready(function() { 
var clickCount = 0; 
$('.covers .col-md-4').each(function() { 
    $('.front', this).click(function() { 
     clickCount = (clickCount == 5) ? 0 : clickCount; 
     if (clickCount == 0) { 
      $('.back').html("<div class='back_content_1'>CONTENT 1</div>"); 
      $(this).closest('#flip-toggle').addClass('flip'); 
     } else if (clickCount == 1) { 
      $('.back').html("<div class='back_content_1'>CONTENT 2</div>"); 
      $(this).closest('#flip-toggle').addClass('flip'); 

     } else if (clickCount == 2) { 
      $('.back').html("<div class='back_content_1'>CONTENT 3</div>"); 
      $(this).closest('#flip-toggle').addClass('flip'); 
     } else if (clickCount == 3) { 
      $('.back').html("<div class='back_content_1'>CONTENT 4</div>"); 
      $(this).closest('#flip-toggle').addClass('flip'); 
     } else if (clickCount == 4) { 
      return false; 
     } 
     clickCount++; 
    }); 
}); 
    }); 

Answer 1

問題是，你是用靶向類.back所有元素，與你的選擇：

$('.back').html 

例如：使用：$(this).next().html...。

更新提琴：https://jsfiddle.net/g0go9sgh/9/