Recentering D3 force layout diagram on node click

I am trying to create a force diagram that gets re-centered on click.

I am following this as a base:

I tried to adjust the click function to set d.fixed=true and also assign fixed points for d.x and d.y.

However, I need to turn d.fixed=false for all the other nodes. Also, the node does not transition to the center on click.

My question is how do I set all other fixed properties to false and then redraw the force diagram with the new center?

I have prepared an example here:

The click function is fairly straightforward:

  function click(d) {
        d.fixed=true;
        d.x=10;
        d.y=10;
        update();
    }

I tried adding this to the function:

root.forEach(function (d) { d.fixed = false; });