[Solved]-How to hide Axes Crosshairs by onclick event in Highcharts-Highcharts

I fixed your demo, which has a few errors.

 $('#toggle_tooltip').click(function() {
        var chart = $("#container").highcharts();
        var x_tool = chart.xAxis[0].crosshair.label && chart.xAxis[0].crosshair.label.enabled;
        var y_tool = chart.yAxis[0].crosshair.label && chart.yAxis[0].crosshair.label.enabled;


        if (x_tool && y_tool) {
          chart.xAxis[0].update({
            crosshair: false
          });
          chart.yAxis[0].update({
            crosshair: false 
          });
        } else {
          chart.xAxis[0].update({
            crosshair: {
              dashStyle: 'solid',
              color: '#248EC6',
              label: {
                enabled: true,
                padding: 8,
              }
            }
          });
          chart.yAxis[0].update({
            crosshair: {
              dashStyle: 'solid',
              color: '#248EC6',
              label: {
                enabled: true,
                padding: 8,
              }
            }
          });
        }
      });

Demo:

• http://jsfiddle.net/svq83uv8