0

I have a button I would like to wrap with multiple html elements with classes. I have tried multiple approaches but it either does not work I get errors.

jQuery(".button--bubble").insertAdjacentHTML('beforebegin','<div class="class-1"><div class="class-2"></div></div>');
jQuery(".button--bubble").insertAdjacentHTML('afterend','<div class="class-1"><div class="class-2"></div></div>');
Emma Kitching
  • 73
  • 6
  • This is a native javascript method - look at this instead https://stackoverflow.com/questions/6617829/insertadjacenthtml-in-jquery – StudioTime May 10 '21 at 12:42
  • You are not wrapping anything with this code, you are just placing it before or after your button – cloned May 10 '21 at 12:42
  • Does this answer your question? [Pure javascript method to wrap content in a div](https://stackoverflow.com/questions/6838104/pure-javascript-method-to-wrap-content-in-a-div) – caramba May 10 '21 at 12:53
  • Try like this : `jQuery('
    ').insertBefore('.button--bubble');jQuery('
    ').insertAfter('.button--bubble');`     – Swati May 10 '21 at 12:54

1 Answers1

0

Try this:

$(".button--bubble").before('beforebegin','<div class="class-1"></div><div class="class-2"></div>');
$(".button--bubble").after('afterend','<div class="class-1"><div class="class-2"></div></div>');

Also you can use .prepend and .append they are similar but, the elements will be inside the targeted elements .

Michael Dahan
  • 128
  • 6