Pass C# object array to Javascript

Question

I know there are a lot of great examples as to how to do this but I can't quite seem to get passing an array of objects from C# to javascript to work. I think I am really close because the array on the client side is receiving something, when I send 12 things, it prints out this:

"[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]"

As you can see there are objects, and even 12 of them which means that it is getting sent (at least relatively) properly and stored in. I am just not sure how to parse the string into the objects and store them in the array. The code below is how I get the long string of objects above. Reading other examples I have tried parsing the string first with JSON but I can't get it right. Ex

var data;
var nodeEdges = JSON.parse(data);

Below is the code I am using that gets me the long list of '[object Object]'. Here is where I send it:

protected void VisualizeBtn_Click(object sender, EventArgs e)
        {
            List<Connection> Connections = new List<Connection>();  
            var x = from b in db.Connections where (b.VirusId == virusId) select b;
            Connections = x.ToList();
            var json = JsonConvert.SerializeObject(Connections.ToList());
            ClientScript.RegisterArrayDeclaration("nodeEdges", json);
            ScriptManager.RegisterStartupScript(this.Page,Page.GetType(), "id","visualize('#visrep')", true);
        }

And here is my JS where I receive it (I am using D3.js).

var nodeEdges = [];
function visualize(element) {
    d3.select(element).selectAll("h2").data(nodeEdges).enter().append("h2").text(function (d) { return "We did it: " + d});
}

Probably don't need it but here is my object I am trying to send

public class Connection
{
    [Key]
    public int ConnectionId { get; set; }
    public int source { get; set; }
    public int destination { get; set; }
    public bool direct { get; set; }
    public string VirusId { get; set; }
    public Connection(int source_, int destination_, bool direct_, string virusId)
    {
        source = source_;
        destination = destination_;
        direct = direct_;
        VirusId = virusId;
    }
    public Connection()
    {

    }
}

EDIT

I have broken down the issue into an even simpler example. My new C#

protected void btnTest_Click(object sender, EventArgs e)
{
    string json = JsonConvert.SerializeObject(new testClass(66, 77));
    ClientScript.RegisterArrayDeclaration("data", json);
    ScriptManager.RegisterStartupScript(this.Page, Page.GetType(), "id", "testFunc()", true);
}

My new javascript

var data;
function testFunc() {
    d3.select("#stuff").append("h2").text(data);
}

The serialized string is not being received into the 'data' var. When I step through the C# the serialized string is there and looks good but it just isn't showing up in the JS

My 'testClass' for those scientists out there

public class testClass
{
    public int target { get; set; }
    public int source { get; set; }
    public testClass(int t, int s)
    {
        target = t;
        source = s;
    }
    public testClass()
    {

    }
}

Answer 1

In regards to the simplified problem in my above edit the solution was painfully obvious. All I had to do was change the JS function to the code below and I can access the array. Truly the definition of obvious.

var data;
function testFunc() {
    d3.select("#stuff").append("h2").text(data[0].source);
}