title: jQuery colorbox loading local content in all except Chrome
body: <p>I am using Colorbox to load some content from an external (but local) file.</p>
  
  <p>The content appears in everything except Google Chrome.</p>
  
  <p>The linke with the event handler attached:</p>
  
  <pre><code>    &lt;div id="content"&gt;
          &lt;p&gt;&lt;a id="modal" href="popup.html" target="_blank"&gt;link to popup&lt;/a&gt;&lt;/p&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>This is the jQuery:</p>
  
  <pre><code> $(document).ready(function(){
     $("#modal").colorbox({
          innerHeight:200,
          innerWidth:530,
          title:false,
          transition:"none",
          onComplete:function(){
              $("#cboxLoadedContent div:first").attr("id", "pop");
          }
     });
   });
  </code></pre>
  
  <p>And the page i am trying to inject:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="ltr"&gt;
  &lt;head&gt;  
      &lt;meta http-equiv="content-type" content="text/html; charset=utf-8" /&gt;
      &lt;title&gt;Hotels.com&lt;/title&gt;
      &lt;meta name="title" content="" /&gt;
      &lt;meta name="keywords" content="Hotels, travel" /&gt;
      &lt;meta name="author" content="Ryan Pays" /&gt;
      &lt;link rel="icon" href="favicon.ico" type="image/x-icon" /&gt;  
  &lt;/head&gt;
      &lt;body id="pop"&gt;
          &lt;div class="wrap"&gt;
              &lt;div class="section"&gt;
                  &lt;div class="redBar"&gt;
                      &lt;p&gt;Lorem ipsum&lt;/p&gt;
                  &lt;/div&gt;
                  &lt;form id="frmExp" name="frmExp" method="post" action="#"&gt;
                      &lt;fieldset&gt;
                          &lt;legend&gt;A form&lt;/legend&gt;
                          &lt;ul&gt;
                              &lt;li&gt;
                                  &lt;input type="radio" id="radYes" name="rdAnswer" value="Yes" /&gt;
                                  &lt;label for="radYes"&gt;Yes&lt;/label&gt;
                              &lt;/li&gt;   
                              &lt;li&gt;    
                                  &lt;input type="radio" id="radNo" name="rdAnswer" value="Yes" /&gt;
                                  &lt;label for="radNo"&gt;No&lt;/label&gt;
                              &lt;/li&gt;
                              &lt;li&gt;
                                  &lt;button type="submit"&gt;
                                      &lt;span&gt;Button&lt;/span&gt;
                                  &lt;/button&gt;
                              &lt;/li&gt;
                              &lt;li&gt;
                                  &lt;button type="submit"&gt;
                                      &lt;span&gt;Bigger button&lt;/span&gt;
                                  &lt;/button&gt;
                              &lt;/li&gt;
                              &lt;li&gt;
                                  &lt;button type="submit" class="back"&gt;
                                      &lt;span&gt;Back button&lt;/span&gt;
                                  &lt;/button&gt;
                              &lt;/li&gt;
                          &lt;/ul&gt;
                      &lt;/fieldset&gt;
                  &lt;/form&gt;
              &lt;/div&gt;
              &lt;div class="aside"&gt;
                  &lt;ul&gt;
                      &lt;li&gt;Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam placerat aliquet nibh&lt;/li&gt;
                      &lt;li&gt;Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nullam placerat aliquet nibh&lt;/li&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>