title: Iframe not embedding in a div using jQuery
body: <p>I am facing a weird issue with jQuery <code>append()</code> method. I want to append a container containing <code>iframe</code> in a div but somehow its not working, though If instead of appending a div containing <code>iframe</code>, if I replace this with any other normal div its working fine.</p>
  
  <p><strong>Jquery/JavaScript code -</strong></p>
  
  <pre><code>var imageURL = 'https://www.youtube.com/embed/zZasH6qkn8M';
  var setWidth = '90%';
  var setHeight = '211px';
  var iframeContainer = '&lt;div id="iframecontainer" style="position: relative;left: 50%;border: 0;top: 50%;transform: translate(-50%, -50%)"&gt;'+'&lt;iframe id="ytFrameId" class="ytClassa" width="' + setWidth + '" height="' + setHeight + '" src="' + imageURL +'&gt;&lt;/iframe&gt;'+'&lt;/div&gt;';
  
  //var iframeContainer = '&lt;div id="retro"&gt;This is retro&lt;/div&gt;';
  $('#test').append(iframeContainer);
  </code></pre>
  
  <p>Let me know what I am doing wrong with my approach.</p>
  
  <p>Fiddle - <a href="https://jsfiddle.net/vo4cg8o3/" rel="nofollow noreferrer">https://jsfiddle.net/vo4cg8o3/</a></p>