How can I inject a string of HTML into an element?

Question

Using Mootools, we can inject an element into another element:

$('childID').inject($('parentID'), 'top');

The second parameter allows me to control the location and can either be 'top' or 'bottom' to inject it into a parent object or 'before' or 'after' to inject it as a sibling.

We can also set the HTML of an element from a string:

var foo = "<p>Some text</p>";
$('parentID').set('html', foo);

My problem is that I want to have the same flexibility with strings as I do with elements. I can't, for example, put a string at the top of an element using set() as this overwrites the HTML rather than appending it at a specific location. Similarly, I can't append HTML after or before a sibling element.

Is there a function that will allow me to inject strings in the same way as I inject elements?

Answer 1

Insert at bottom:

foo.innerHTML = foo.innerHTML + 'string';

Insert at top:

foo.innerHTML = 'string' + foo.innerHTML;