title: How to Append Content to Current Page (Active Tab) DOM Using Chrome Extention
body: <p>I am trying to add some content to active document(Active tab) by Chrome extension. Here is what I have:</p>
  
  <p>popup.html</p>
  
  <pre><code> &lt;button class="btn btn-default" id="clear" type="submit"&gt;&lt;/button&gt;
  </code></pre>
  
  <p>popup.js</p>
  
  <pre><code>$('#clear').on('click', function () {
      $('tr').eq(0).append("Some Test");
  });
  </code></pre>
  
  <p>and manifest.json</p>
  
  <pre><code>{
    "manifest_version": 2,
  
    "name": "Adder",
    "description": "Adding Content",
    "version": "1.0",
    "background" : {
    "scripts" : ["jquery.min.js","popup.js"],
    "persistent": false
    },
    "content_scripts": [ {
     "js": [ "jquery.min.js", "popup.js"],
     "matches": [ "http://*/*", "https://*/*"]
    }],
    "browser_action": {
     "default_icon": "icon.png"
    },
    "permissions": [
     "activeTab"
     ]
  }
  </code></pre>
  
  <blockquote>
    <p>Update</p>
  </blockquote>
  
  <pre><code>$('#clear').on('click', function () {
      chrome.tabs.executeScript({ code: 
      'document.body.style.backgroundColor="red"' });
       alert("test");
  });
  </code></pre>