Data binding in Polymer
<p>I have this function which gives me a JSON return value when it is called.</p>

<pre><code>getJSON function(url, success){
var ud = '_' + +new Date,
        script = document.createElement('script'),
        head = document.getElementsByTagName('head')[0]
               || document.documentElement;
        window[ud] = function(data) {
            head.removeChild(script);
            success &amp;&amp; success(data);
        };
        script.src = url.replace('callback=?', 'callback=' + ud);
        head.appendChild(script);
}
</code></pre>

<p>And to call the function, I use the following code.</p>

<pre><code>getJSON('https://newsapi.org/v1/articles?source=techcrunch&amp;apiKey={APIKEY}', function(data){
          //Stuff to be done with the data
        });
</code></pre>

<p>And then I have a paper card to which I want to bind the JSON value that I get.</p>

<pre><code>&lt;paper-card heading="Card Title"&gt;
      &lt;div class="card-content"&gt;{{json}}&lt;/div&gt;
&lt;/paper-card&gt;
</code></pre>

<p>What I want to do is that call that declare the getJSON function the polymer way, call the function and set the JSON value returned to the <code>{{json}}</code> data element in the paper card. I have tried more than 5 ways of doing the above but I could not do what I wanted to. I am new to polymer so please help me.</p>