title: Using jQuery in Chrome extension: load in background, access in popup
body: <p>I am making a <a href="http://code.google.com/chrome/extensions/pageAction.html" rel="nofollow">PageAction</a> Chrome extension with a popup and a <a href="http://code.google.com/chrome/extensions/content_scripts.html" rel="nofollow">content script</a>. </p>
  
  <p>I want to use jQuery in the popup to manipulate its DOM for presenting data (which I am scraping from the website itself using jQuery injected as a content script). I know I can load jQuery directly in popup.html and use it. However, I wanted to see if I could load jQuery only once in the background page and access it in the popup, rather than loading it each time the popup is opened.</p>
  
  <p>For this, I tried the following in the popup:</p>
  
  <pre><code>var background = chrome.extension.getBackgroundPage();
  var $ = background.jQuery;
  $("#testID").innerHTML = "testing jQuery";
  </code></pre>
  
  <p>but it didn't work - <code>$("#testID")</code> was undefined. I checked that jQuery was loaded in the background page, and using alternate names for $, e.g. jq, jQuery etc. didn't work either.</p>
  
  <p>Any suggestions on how to make this work?</p>