How to select parent element of current element in d3.js

Question

I want to access the parent element of current element

Here is the structure of HTML

svg    g id=invisibleG      g        circle      g        circle      g        circle 

Basically I want to add text inside the circles when I hover over them.

So I want something like this on hover of any particular circle

svg        g id=invisibleG          g            circle --> radius is increased and text presented inside that            text          g            circle          g            circle 

On hover I can select current element through d3.select(this),How can I get root element(g in my case)?

Answer 1

You can use d3.select(this.parentNode) to select parent element of current element. And for selecting root element you can use d3.select("#invisibleG").