In my chrome extension, Injection of contenscript into a page not working?

See more:

Javascript

extension

chrome

I injected contentscript into a page by :

//this is in background.js
  chrome.tabs.executeScript(null, {"file": "contentscript.js"});

Then to check if it inserted well or not I modified an element on the page, but no changes made.
Did I inject it properly?

Here are my files :

**background.js:**

  //injecting contentscript here
        chrome.tabs.executeScript(null, {"file": "contentscript.js"});

  //receiving end
        var title;
        chrome.runtime.onMessage.addListener(function(message,sender,sendResponse){
        if(message.method == 'setTitle')
        title = message.title;
        else if(message.method == 'getTitle')
        sendResponse(title);
    });

**contentscript.js:**

<script>

   var table = document.getElementsByClassName("collapse")[0];

   var marks = new Array();

    for(var i=0;i<8;i++)
      marks[i] = table.children[0].children[i+1].children[5].innerHTML;

    var total=0;
    for(var i=0;i<8;i++)
      total += Number(marks[i]);

//code to send the data to background.js
    var fromDOM = total;
    chrome.runtime.sendMessage({method:'setTitle',title:fromDOM});
    
    </script>

**popup.js:**

   var total= 0,percentage = 0;


   chrome.runtime.sendMessage({method:'getTitle'}, function(response){
  $('.total').text(response);
  percentage = total/7.25;
  $('.percentage').text(percentage);

});

Why is this not working? Any changes or errors?


**This is how my popup.html is looking :**

http://i.stack.imgur.com/lrKBZ.png