Question

I want to create a div around the clicked element without affecting the style of the page and i need to remove the inserted parent after some operations. Do anybody have any idea to do like that?

Edit: Please note that i don’t want to use any JavaScript library

Answer 1

I can’t guarantee it won’t affect styles, but as for the rest, try something like this (inside the click handler function):

var div = document.createElement("div");
var parent = this.parentNode;
parent.insertBefore(div, this);
div.appendChild(this);

If you’re still in the function when you want to remove the new div element:

parent.insertBefore(this, div);
parent.removeChild(div);

If not, you’ll need to reaquire it. Let’s assume you have a trigger for that, and this is still the clicked element:

var div = this.parentNode;
var parent = div.parentNode;
parent.insertBefore(this, div);
parent.removeChild(div);