$(document).ready(function(){
var ColorBars = document.getElementsByClassName("color-bar");
var number = 0;
ColorBars[0].onclick = hideLine(0);
function hideLine(index){
var charts = $("#line-container").highcharts();
var series = charts.series[index];
if(series.visible){
series.hide();
} else {
series.show();
}
}
});
If I remove the parameter in hideLine() and only use
ColorBars[0].onclick = hideLine
then it works as intended.
The goal is to target all elements by their class name, so when a user clicks on any color bar, I can identify which one was clicked and disable the corresponding chart line in highcharts.