title: Chrome extension to change DOM with a button in extension popup
body: <p>i am completely new to chrome extension development.
  I am trying to change the DOM (append data to active webpage) when clicked on a button in the extension popup. How is this possible.</p>
  <p>the manifest file</p>
  <pre><code>{
    &quot;manifest_version&quot;: 2,
  
    &quot;name&quot;: &quot;test 2&quot;,
    &quot;description&quot;: &quot;test ext 2&quot;,
    &quot;version&quot;: &quot;1.0&quot;,
  
    &quot;browser_action&quot;: {
      &quot;default_icon&quot;: &quot;icon.png&quot;,
      &quot;default_popup&quot;: &quot;popup.html&quot;
    },
    &quot;content_scripts&quot;: [
      {
        &quot;matches&quot;: [&quot;http://*/*&quot;,&quot;https://*/*&quot;],
        &quot;js&quot;: [&quot;jquery.min.js&quot;, &quot;main.js&quot;]
      }
    ],
    &quot;permissions&quot;: [
     &quot;activeTab&quot;
     ]
  }
  </code></pre>
  <p>suppose if the popup.html file is</p>
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
    &lt;head&gt;
      &lt;title&gt;test extension 2&lt;/title&gt;
      &lt;script src=&quot;popup.js&quot;&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;a id=&quot;button&quot;&gt;button&lt;/a&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>and when i click on #button, i want to execute some jquery code in main.js file which will append some data to the active webpage.</p>
  <p>Thank you.</p>