popup to main tab inject (chrome extension)

content_script.js

$("#change").click(function() {


  $.ajax({
    url: "http://api.openweathermap.org/data/2.5/weather?id=5128581&units=imperial",
    dataType: 'json',
    success: function(data) {
      changeMainPage(data);
    },
    error: function() {
      alert("error");
    }
  });  

});


  function changeMainPage(data) {

    // inject jquery
    chrome.tabs.executeScript(null,
        {file:"jquery.js"});


    // inject custom js
    chrome.tabs.executeScript(null, {
        // convert json data into variable string for passing
        code: 'var myData = ' + JSON.stringify(data)
    }, function() {
        // inject actual script
        chrome.tabs.executeScript(null, {file: 'inject.js'});
    });
  }

inject.js

// this gets injected on the main tab page

// we could just log the data to console
console.log(myData);


// or parse the data back from string into object
var data = JSON.parse(myData);

// access data parts, for example
var x = data.weather.clouds;

// modify dom based on data
console.log('test')
$('body').css('background', 'pink');