I ran into a whlie problem trying to clone a parent div and then adding it directly under myself. My function works fine while the last node is selected like this:
<div>
<div> A </div>
<div> B </div>
<div> C </div>
</div>
will result in
<div>
<div> A </div>
<div> A.1 </div>
<div> B </div>
<div> C </div>
</div>
If I clone A. But if I clone A again, I will receive.
<div>
<div> A </div>
<div> A.1 </div>
<div> A </div>
<div> A.1 </div>
<div> B </div>
<div> C </div>
</div>
while I would like
<div>
<div> A </div>
<div> A.1 </div>
<div> A.1 </div>
<div> B </div>
<div> C </div>
</div>
My markup and code is below:
<div id="maindiv">
<div>
<label>First</label>
<input type="button" class="repeat1" onclick="Repeat(this)"/>
</div>
<div>
<label>Second</label>
<input type="button" class="repeat1" onclick="Repeat(this)"/>
</div>
<div>
<label>Third</label>
<input type="button" class="repeat2" onclick="Repeat(this)"/>
</div>
</div>
function Repeat(obj)
{
var CurrentDiv = $(obj).parents("div[class^='repeat']:first");
$(CurrentDiv).clone().appendTo(CurrentDiv).end();
}
I also have a similar delete problem, where all child nodes are deleted, and I just want to delete one div. Any help would be greatly appreciated. Delete function
function Remove(obj)
{
var CurrentDiv = $(obj).parents("div[class^='repeat']:first");
CurrentDiv.remove();
}
source
share