Is there a function to highlight another stat/point/column while hovering element on Highcharts?

I'm setting up highcharts and want to highlight both two columns/serie/point when I'm hovering in one.

JS Fiddle: http://jsfiddle.net/dybtupjc/6/

Researched the web and found that I can use mouseOver & out to handle the element, but I can only handle one, not all of the stats of the series (which is what I need: hover one, and also the other on the other corner)

Tried this, but didn't work..

 this.chartConfig.series = [{type: 'column',name: 'Dh',data: dataPoll,point: {
           //events of highcharts
            events: {
           // on mouse over
                mouseOver: function () {
                     var number;
           // loop through all the values that the chart has
                    for(var i = 0; dataPoll.length > i; i++){
           // this.y is the value formatted on the charted and provide in the mouseOver function
                        if(dataPoll[i] == this.y) {
                            console.log("Match", dataPoll[i])
                            console.log("Number", i)
           // And since there are 12 categories (columns), I add 6 to the hover (which is for testing the first numbers, higher numbers will definitely not work), so it can highlight the upper column
                            var number = i + 6;
                            console.log("Sum", number)

                            $scope.setColorSeries(number);
                        }
                    }
           // This is actual valid code, it updates the color of the column under the cursor. Maybe there is a function to call like: this.data[6].update(....)
                    this.update({
                        color: '#000',
                        colorThis: this.color,
                        numberExtrem: number + 6
                    });

                },
                mouseOut: function () {
                    console.log("out mouse!", this)
                    this.update({
                        color: this.colorThis
                    });
                }
            }
        }}];

Now, what I want is this:

https://i.imgur.com/s6eEPAU.png

It should work like this: https://s2.gifyu.com/images/screencast-zthg20.axshare.com-2018.12.28-17-49-30.gif But the actual output is that I'm hovering the column under the cursor, and I need to highlight both cursor and other column (which it will be its counterpart)

This is the fiddle I uploaded. The column under the arrow needs to be black as well. https://i.imgur.com/U3L4Ioa.png

And I have a question, how could as well add and arrow between both two columns?

Thanks in advance.