JSFiddle - React, Tailwind, and code Playground

by secretgspot

HTML

<ul id="list">
    <li class="selected" data-flight-name="kingfisher" data-flight-id="E6-184">Kingfisher</li>
    <li class="" data-flight-name="indigo" data-flight-id="E6-185">Indigo</li>
</ul>

JavaScript

var data = {
  "flightInfo" :{
    "indigo": [
          {"E-184" : {"flightName": "Indigo", "duration": "1h:0m", "baseFare": 1753, "travelTime": "11:13 - 12:13"}},
          {"E-185" : {"flightName": "Indigo", "duration": "1h:0m", "baseFare": 1753, "travelTime": "11:13 - 12:13"}},
          {"E-186" : {"flightName": "Indigo", "duration": "2h:30m", "baseFare": 8000, "travelTime": "11:13 - 16:13"}},
          {"E-187" : {"flightName": "Indigo", "duration": "6h:30m", "baseFare": 6000, "travelTime": "11:13 - 16:13"}},
          {"E-189" : {"flightName": "Indigo", "duration": "5h:0m", "baseFare": 9907, "travelTime": "11:13 - 16:13"}}
      ],

    "kingfisher": [
          {"E-184" : {"flightName": "KF RED", "duration": "1h:0m", "baseFare": 2819, "travelTime": "10:13 - 11:13"}},
          {"E-184" : {"flightName": "KF RED", "duration": "1h:0m", "baseFare": 2819, "travelTime": "11:13 - 16:13"}},
          {"E-184" : {"flightName": "KF RED", "duration": "2h:30m", "baseFare": 18000, "travelTime": "11:13 - 16:13"}},
          {"E-184" : {"flightName": "KF RED", "duration": "6h:30m", "baseFare": 16000, "travelTime": "11:13 - 16:13"}}
      ]
  }
};

$("#list").delegate("li", "click", function(){
    var $this          = $(this),
        dataflightname = $this.attr('data-flight-name'),
        dataflightid   = $this.attr('data-flight-id');

    if($this.siblings().hasClass('selected')){
      $this.siblings().removeClass('selected');
      $this.addClass('selected');

      // Featcing Flights Information
      //$.getJSON("javascript/abc.json",function(data){
        for (var i = 0, len = data.flightInfo[dataflightname].length; i < len; i++) {
            console.log(data.flightInfo[dataflightname][i]);
            //output will be (for the first index): {"E-184" : {"flightName": "Indigo", "duration": "1h:0m", "baseFare": 1753, "travelTime": "11:13 - 12:13"}}
        }
      //});
    }
  });