What you want in full jQuery is:
$("#foo").empty().append('<br/><img src="asdf.gif"><br/>');
which is the exact equivalent of
$("#foo").html('<br/><img src="asdf.gif"><br/>'); // html() does call
this.empty().append()
It is very different from the browser innerHtml since your HTML will
first be parsed by jQuery into a DOM tree while innerHtml just insert
your raw source.
One side effect of innerHtml is that the browser may trigger quirk
rendering if you use it. Because the browser does not ensure your HTML
is actually valid, some browsers (like Firefox in XHTML mode) just
switch back to quirk mode if you use innerHtml. (document.write() has
the same kind of issues.)
Always using jQuery to parse your HTML into a DOM tree will allow you
to keep your document in standard rendering.
Have fun with jQuery
On Dec 18, 4:41 am, ken <jqu...@kenman.net> wrote:
> You're right, somehow I missed it. Thanks everyone!
>
> On Wed, Dec 17, 2008 at 9:22 PM, Ricardo Tomasi <ricardob...@gmail.com>wrote:
>
>
>
> > What's wrong with the solution suggested by Kean above? It's prettier
> > than this and works fine.
>
> > $('#foo').html('<br/><img /><br/>').find('img').attr
> > ("src","asdf.gif");
>
> > - ricardo
>
> > On Dec 17, 6:03 pm, ken <jqu...@kenman.net> wrote:
> > > That's basically the form I've developed thus far:
>
> > > var img = jQuery( '<img/>' ).attr( 'src', 'image.gif' );
> > > jQuery( '#foo' ).html( img ).prepend( '<br/>' ).append(
> > '<br/>'
> > > );
>
> > > It just seems very inelegant contrasted with the 'normal' jQuery usage.
>
> > > On Wed, Dec 17, 2008 at 11:41 AM, Hector Virgen <djvir...@gmail.com>
> > wrote:
> > > > Or you could do this:
>
> > > > var img = << your image element wrapped in <br />s >>
> > > > $('#foo').html(img);
>
> > > > -Hector
>
> > > > On Wed, Dec 17, 2008 at 9:36 AM, brian <bally.z...@gmail.com> wrote:
>
> > > >> On Wed, Dec 17, 2008 at 11:13 AM, ken <jqu...@kenman.net> wrote:
> > > >> > I need to replace the contents of #foo.
>
> > > >> > I would love to use CSS, and if I were starting anew that would be
> > the
> > > >> case,
> > > >> > but unfortunately I am working on an existing application converting
> > the
> > > >> > plain-jane JS to jQuery. I'm simply trying to replace existing
> > > >> functionality
> > > >> > WITHOUT affecting the HTML because the HTML is very fragile (the
> > > >> existing JS
> > > >> > utilizes DOM walking exclusively, so removing/replacing nodes causes
> > a
> > > >> > cascade of fail).
>
> > > >> ok, then, how about just using a string instead of setting the
> > attributes
> > > >> later?
>
> > > >> $('#foo').html('<br /><img src="image.gif" /><br />');
