Search code examples
jqueryjquery-pluginsinternet-explorer-9

What is the proper way to create div inside a div?


Seems Angle Brackets Are Not Allowed in the createElement Method has some impact on plugins.

I do not have the plugin, nor IE9 but for my own education, what is a proper way to code the following two lines in jQuery 1.6+

$('<div id="'+options.loupeWrap.substring(1)+'"><div id="'+options.loupe.substring(1)+'" /></div>').appendTo(options.appendTo);
$('<div id="'+options.zoomWrapper.substring(1)+'" />').appendTo(options.loupe);

for example I have seen $('<div class="bla"></div>') but not $('<div id="bla"></div>') and am curious how to cleanly create a div with an ID and chain it to another div with an ID using the best practice jQuery possible and not just something that works because jQuery is very clever.

I also checked out wrap

This SEEMS to be valid and correct

Is it?

$('<div>')
  .attr('id',outerID)
  .append(
    $('<div>')
    .attr('id',innerID)
  )
  .appendTo(options.appendTo);

Thanks for your input.


Solution

  • This is how I did it with jQuery:

    $('<div>', { 
        id: 'outsidediv'
    }).append( $('<div>', { 
        id: 'innerdiv'
    })).appendTo('#container');
    

    Example: JsFiddle Demo * The example shows how you can add html to the divs