Accessing JSON object within script tag in Jade

I am new to Jade and Express. I have a JSON object that I can reference as #{data}. The object contains several fields, and I would like to dynamically add them to a table. I can add it to the table properly, but my problem is I cannot access the JSON within a script tag. In the code below, I have hard coded what part of the object should look like. However, when I try to loop over the JSON nothing appears. How do I access it?

extends layout
block content
  table
    tr
      th Name
      th Position
      th Standard Projection
      th Custom Projection
      th FPI
  script(type='text/javascript', src='http://code.jquery.com/jquery-2.1.0.min.js')
  script(type='text/javascript').
    $(document).ready(function() {


      //This is what the data looks like   
      var data = [ { position: 'wr',
       name: 'Calvin Johnson (DET) ',
       standard_projection: '228.5',
       custom_projection: 228.46,
       FPI: 78.48999999999998 },
     { position: 'wr',
       name: 'Demaryius Thomas (DEN) ',
       standard_projection: '219.4',
       custom_projection: 219.35999999999999,
       FPI: 69.38999999999996 },
     { position: 'wr',
       name: 'Julio Jones (ATL) ',
       standard_projection: '202.4',
       custom_projection: 202.42000000000002,
       FPI: 52.44999999999999 }]


      //Adds players to the table
      for (var i = 0; i < data.length; i++) {
        tr = $('<tr/>');
        tr.append("<td>" + data[i].name + "</td>");
        tr.append("<td>" + data[i].position + "</td>");
        tr.append("<td>" + data[i].standard_projection + "</td>");
        tr.append("<td>" + data[i].custom_projection + "</td>");
        tr.append("<td>" + data[i].FPI + "</td>");
        $('table').append(tr);
      }
    });