Why does D3 Drag not work?

Question

So I'm trying to test the drag option but I'm having a particular issue over here.

This is what I have.

selection = d3.select('.right.menu');
var drag = d3.behavior.drag();
selection.call(drag)
selection.on('drag',function(){
 console.log(this);
})

And this just doesn't print the console.log(this);

But if I try with

selection.on('click',function(){
     console.log(this);
    })

The thing starts printing the console.log();

I think I'm missing something over here but I'm not sure that.

My first thought was that this is a Semantic-ui issue, since they place somewhere the DOM Elements, and for some reason the drag event just doesn't work, but I discard that option because the click event is working.

Answer 1

What if you change it up a bit, change the order and assign drag as the eventListener.

var drag = d3.behavior.drag();
drag.on('drag',function(){
 console.log(this);
})
selection = d3.select('.right.menu');
selection.call(drag);