papaiatis
papaiatis

Reputation: 4291

Removing cloned jQuery UI button will remove base button's style

I've set up this Fiddle for you: http://jsfiddle.net/MNpRh/4/

$("#removebtn").button();
$(document).on("click", ".remove", function(){
   $(this).remove();
});
$("#clone").click(function(){
   $("#removebtn").parents(".group").clone(true).appendTo("#content");
});

Hit Clone a couple times then remove any button. The button style will be removed and not cloned again.

It's based on jQuery UI 1.8. It works in 1.10, but I'm not able to upgrade jQuery UI.

How would you solve this?

Thanks in advance!

Upvotes: 1

Views: 111

Answers (1)

gregjer
gregjer

Reputation: 2843

To keep hover effect please see modified solution with added pattern div which is hidden by CSS http://jsfiddle.net/MNpRh/8/

Addition to HTML:

<div class="group" id="pattern">
     <button class="remove">Remove me</button>
</div>

CSS:

#pattern { display:none;}

JQuery:

$("#removebtn").button();
$(document).on("click", ".remove", function(){
    $(this).remove();
});
$("#clone").click(function(){
  $('#pattern').clone().appendTo("#content").removeAttr('id').find('button').button();
});

Upvotes: 1

Related Questions