Jquery clone div pour les premières fois, arrêter les utilisateurs pour le clonage plus de 6 fois

Question

J'essaie de créer un div clone à un div existant. le clone fonctionne et permet à l'utilisateur de cloner le div en cliquant sur le bouton. Maintenant, ce que je voudrais être une validation où l'utilisateur est seulement autorisé à cloner div jusqu'à 6 fois seulement et si l'affichage possible un message de « vous n'êtes pas autorisé à ajouter plus élément »

<div id ="specdiv "> 
     <fieldset class="fieldset"> 
       <legend class="legend">Question Specification</legend> 
       <div class="editor-label"> 
      @Html.LabelFor(model => model.OfferedAnswer) 
     </div> 
      <div class ="answerchoice1" id=""> 
     <div class="editor-field"> 
      @Html.TextAreaFor(model => model.OfferedAnswer.AnswerText) 




     </div> 
       </div> 

      </fieldset> 


    </div> 
<button id="quesId" class="mini-button" type =" button">+</button> 

$(document).ready(function() { 
    $('button').click(function() { 
     //$('.answerchoice1').before($('.answerchoice1').clone()) 
     var $target = $('.answerchoice1').find('div.editor-field:first'); 
     $target.clone().appendTo('.answerchoice1'); 
     var tID = $(this).attr(".answerchoice1").split(/ _/); 
     //console.log($('.example-1').html()); 
    }) 

}) 

Answer 1

Quelque chose comme c'est ce que vous recherchez:

$(document).ready(function() { 
    $('button').click(function() { 
     if($('.editor-field').length >= 6){ 
     alert('No more than 6!'); 
     return false; 
     } 
     //$('.answerchoice1').before($('.answerchoice1').clone()) 
     var $target = $('.answerchoice1').find('div.editor-field:first'); 
     $target.clone().appendTo('.answerchoice1'); 
     var tID = $(this).attr(".answerchoice1").split(/ _/); 
     //console.log($('.example-1').html()); 
    }) 

}) 

violon travail: https://jsfiddle.net/on3kj4hp/

Hope it helps!