title: Loading html into page element (chrome extension)
body: <p>I'm trying to write a Chrome extension that will have a bar at the top of certain webpages.  If I have my content script like this:</p>
  
  <pre><code>$('body').prepend('&lt;div id="topbar"&gt;&lt;h1&gt;test&lt;/h1&gt;&lt;/div&gt;');
  </code></pre>
  
  <p>everything looks good, but what I ultimately want is something like this:</p>
  
  <pre><code>$('body').prepend('&lt;div id="topbar"&gt;&lt;/div&gt;');
  $('#topbar').load('topbar.html');
  </code></pre>
  
  <p>where topbar.html is:</p>
  
  <pre><code>&lt;h1&gt;test&lt;/h1&gt;
  </code></pre>
  
  <p>When I change it to this, though, the webpage is clobbered.  Most of the content disappears, and I just end up seeing some of the ads.  I can't even see the 'test' header.  I've checked to make sure there's no other 'topbar' id on the page.  What's wrong?</p>