wrap() works just like inject(), so do this: new Element('span', { 'class': 'clicked' }).wraps(this);
There are two things problematic with this, however, if I'm reading between the lines in your jsfiddle. 1. It looks like all you want to do is change the background color. You can do this by simply setting the style or class on "this" in your onClick. Note that because of the markup in your jsfiddle, you'll never see any UI changes based on the new wrapper. This is because the inner element (id='clickme') has a style on it that the wrapping span won't override. You have to inspect the DOM to see that your example is doing anything. 2. Your click event runs every time, meaning a new element (wrapper) will be created every time. This will eventually crash the browser by overloading the DOM (try clicking it 10K times by firing the click event in a loop and you'll see what I mean). You can circumvent this by checking for existence of the new element in the onClick (ok), running this.removeEvents() in the click event (clever, but may have side effects if you need other event handlers), or using the "click:once" pseudo event (elegant). Hope this helps. Johnny Fuery President/Principal Engineer Fuery Solutions -- makers of MerusCase 1736 Franklin Street, Suite 350 Oakland, CA 94612 510.550.5000 Main 925.997.3878 Mobile 510-836-0915 Fax j...@fuery.com On Thu, Jan 10, 2013 at 3:08 PM, 4fingers <graemek...@gmail.com> wrote: > Thanks for your reply but I am looking to wrap the new element rather than > inject it. > > For example injecting it simply adds the new element inside the div either > at the bottom or top of the element: > <div id="clickme"> > Click Me > <span class="clicked"></span> > </div> > > Whereas I want to wrap the element so the text is included in the new > element: > <div id="clickme"> > <span class="clicked"> > Click Me > </span> > </div> > > Any other ideas? > > Thanks > >