Copier une div avec le code css

bonjour j'ai un souci pour dupliquer mon div en entier c'est pour faire une option d'ajout du meme div sur la meme page voila mon code :

le div :

Code:

1
2
3
4
5
6
7
8
9
<div id="blocNote" post_it_id="1">
        <div id="titre"> <input id="input1" type="text" name="titre" value="Entrez votre titre">  </input>
        <a><img id="fermer" src="fermer.png" title="fermer"></img></a>
        <a><img id="importer" src="importer.png" title="importer une sauvegarde">
        <a><img id="sauvegarder" src="sauvegarder.png" title="sauvegarder" ></img></a>
        <a><img id="ajouter" src="ajouter.png" title="ouvrir un nouveau bloc note"> </a>  </div>    <hr/>
 
        <div contenteditable="true" id="note" >Saisissez vos notes</div>
    </div>

voila le css du div :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
#blocNote{padding:0 10px 0 10px;max-height:600px;max-width:600px;display:none;background:#FEFEBA;position:absolute;border:1px solid black;height:100px;width:235px;border-radius:5px;padding:5px 5px;line-height:20px;font-size:13px;margin-left:41.5%;margin-top:10%;min-width:235px;min-height:150px;}
 
#titre{display:inline-block;width:100%}
#titre input {text-align:center;height:30%;min-height:30px;max-height:30px;max-width:400px;width:60%;color:#989E9D;border:1px solid black;border-radius:2px;}
#fermer {float:right;line-height:11.5px;text-decoration:none;width:10px;}
#importer {float:right;line-height:11.5px;text-decoration:none;width:10px;padding-right:5px;}
#sauvegarder {float:right;line-height:11.5px;text-decoration:none;width:10px;padding-right:5px;}
#ajouter {float:right;line-height:11.5px;text-decoration:none;width:10px;padding-right:5px;}
 
#note {position:relative;color:#989E9D;border:1px solid black;border-radius:2px;background: white;width:100%;text-align:center;word-wrap:break-word;height:70%;boder:0 5px 0 5px;line-height:800%;overflow:auto;}
 
#blocNote a{cursor:pointer;}

et voila j'ai essaye de mettre une fonction javascript quand j'appuie sur l'image avec id="ajouter" pour faire un duplique du div entier mais ca ne fonctionne pas :

Code:

1
2
3
4
5
//ajouter
$("#ajouter").on("click",function(){
    var copie = $('#blocNote').clone();
    copie.clone(true);
});

Voila merci de me repondre

Bonjour.

Il me semble qu’après l'avoir copié, il faut que tu le places avec prepend ou append selon ce que tu cherches. (http://api.jquery.com/prepend/ http://api.jquery.com/append/).
Ils en parlent d'ailleurs dans la doc de clone : https://api.jquery.com/clone/ .
Code:

1 2 3 4 5 $("#ajouter").on("click",function(){ var copie = $('#blocNote').clone(); copie.appendTo('#ledivoutuveuxlecopier'); });

daccord merci ca fonctionne

merci beaucoup:D:D:D:D:D