Highchart not generating the json properly

Question

I need to create a bar chart from the json data which returns

{"currentDate":"2020-10-21","aCost":82.42,"previousDate":"2019-10-17","bCost":57.18,"cCost":92.8}

When I try to render the data, it is not rendering properly as seen in the below code

1. I need to show only 3 data based on cost and my current chart is not forming based on that as it is returning all the values including the date.

2. The date needs to be shown only in the tooltip

3. How do I append the colors for each bars ?

Fiddle Link

Thanks in advance

$(function (){
function displayChart() {

  $.ajax({
    url: 'https://mocki.io/v1/869bfa3a-f9c0-4385-9610-5295a0ddc303',
    success: function(jsonData) {
      
     
      var name = ['A','B','C'];
      var cost = [];
      var date = [];
      var colors = ['red','blue','green'];

      for (var i in jsonData){
        if(jsonData.hasOwnProperty(i)){
          name.push(name);
          cost.push(jsonData[i]); // Values to generate chart
          colors.push(colors);
        }
      }

        const chart = Highcharts.chart('container',{
      title:{
        text: "Sample Bar Chart"
      },
      xAxis:{
        categories: name
      },

      series:[{
        type: 'bar',
        color: colors,
        colorByPoint: true,
        data:cost,
        showInLegend: true
      }]
    });
    }
  });
}

displayChart();
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container"></div>