[Solved]-d3.js binary tree with HTML as the nodes-d3.js

You would attach the event handlers to the html the same way you would to an svg element

// Enter any new nodes at the parent's previous position.
node.enter()

    // append an html div
    .append("div")

    // event handlers
    .on("click", function(d) {
        // your code to add a new node
    })

(Last time I checked d3's event handlers are pretty basic and don't support custom events)

Handling window resizing can be tricky as you have to set the canvas and html container dimensions before generating the tree.

A quick and dirty way of handling this would be to set very large sizes for the html container

vis = d3.select("#chart-inner").append("svg:svg").attr("id", "svg-container").attr("width", 40000).attr("height", 20000).append("svg:g").attr("transform", "translate(0,100)");

Then wrap it all up with a container div

<div id="chart" style="width:100%; overflow:hidden">
     <div id="chart-inner">

It's not really an ideal solution. If you want to do it properly, you'll have to work out the depth and width of the tree based on the initial html element size (which would involve a lot of 'walking' the data to work out).