Parsing and calculating data At first I calculate the total of each data then give each data of data a percentage base on total. The percentage is calculated by adding its percentage and sum of all percentage before it. I then calculate a new value by multiplying percentage and total. I finally sort them from largest to smallest.

How can I reduce the number of .each loops?

var data= [
    {
        "data": [
            {
                "value": "5700",
                "color": "#1ca2d5",
                "label": "Shortlisted"
            },
            {
                "value": "2570",
                "color": "#ed5d67",
                "label": "Interviewed"
            },
            {
                "value": "1054",
                "color": "#66BB6A",
                "label": "Finallisted"
            }
        ],
        "under": "Top"
    },
{
    "data": [
        {
            "value": "2847",
            "color": "#1ca2d5",
            "label": "Shortlisted"
        },
        {
            "value": "3541",
            "color": "#ed5d67",
            "label": "Interviewed"
        },
        {
            "value": "1486",
            "color": "#66BB6A",
            "label": "Finallisted"
        }
    ],
    "under": "Mid"
},
{
    "data": [
        {
            "value": "16900",
            "color": "#1ca2d5",
            "label": "Shortlisted"
        },
        {
            "value": "12900",
            "color": "#ed5d67",
            "label": "Interviewed"
        },
        {
            "value": "5780",
            "color": "#66BB6A",
            "label": "Finallisted"
        }
    ],
    "under": "Dhsanullah University of Science and Technology"
},
{
    "data": [
        {
            "value": "5700",
            "color": "#1ca2d5",
            "label": "Shortlisted"
        },
        {
            "value": "2570",
            "color": "#ed5d67",
            "label": "Interviewed"
        },
        {
            "value": "1054",
            "color": "#66BB6A",
            "label": "Finallisted"
        }
    ],
    "under": "TTop"
},
    {
        "data": [
           {
               "value": "5700",
               "color": "#1ca2d5",
               "label": "Shortlisted"
           },
           {
               "value": "2570",
               "color": "#ed5d67",
               "label": "Interviewed"
           },
           {
               "value": "1054",
               "color": "#66BB6A",
               "label": "Finallisted"
           }
        ],
        "under": "Tcop"
    }
];

var tempData=[];
$.each(data, function (i, d) {
            var total = 0;
            $.each(d.data, function (j, obj) {
                total += parseInt(obj.value);
            });
            d["total"] = total.toString();
        });

        $.each(data, function (i, d) {
            var percentage = 0;
            $.each(d.data, function (j, obj) {
                obj["original"] = obj.value;
                var per = (parseInt(obj.value) * 100) / parseInt(d.total);
                percentage += per;
                obj["percentage"] = per;
                obj.value = (parseInt(d.total) * percentage) / 100;
                obj["under"] = d.under;
            });

        });
        $.each(data, function (i, d) {
            d.data.sort(function (a, b) { return b.value - a.value; });
            $.each(d.data, function (j, obj) {
                tempData.push(obj);
            });
        });
Yes, you can reduce the number of $.each(), and also simplify the whole code, in several ways.

Note that to improve readability I replaced some variable names:

. data replaced by source (to avoid confusing with data members in objects)

. d replaced by objSet inside of functions (more significant, as it is really a set of obj)

. all i and j replaced by index (more significant, and don't need to be different inside of different functions)

. tempData --> result

That's said, the first simplification come from the fact you don't need to iterate three times on the (now said) source, because there is no interaction between different objSets of source.
So instead of:

var tempData=[];
$.each(data, function (i, d) {
  // first step
});

$.each(data, function (i, d) {
  // second step
});

$.each(data, function (i, d) {
  // third step
});


it becomes:

var result=[];
$.each(source, function (index, objSet) {
  // first step
  // second step
  // third step
});


Then we can simplify each step...

Computing total can be achieved without $.each so this step:

var total = 0;
$.each(d.data, function (j, obj) {
    total += parseInt(obj.value);
});
d["total"] = total.toString();


can be achieved using reduce():

  objSet.total = objSet.data.reduce(function(total, obj) {
      return total + parseInt(obj.value);
  }, 0);


or even simpler in ES6:

objSet.total = objSet.data.reduce((total, obj) =&gt; total + parseInt(obj.value), 0);


The second step can use map() instead of $.each(), and also be slightly alleviated avoiding the temporary per variable. So rather than:

var percentage = 0;
$.each(d.data, function (j, obj) {
    obj["original"] = obj.value;
    var per = (parseInt(obj.value) * 100) / parseInt(d.total);
    percentage += per;
    obj["percentage"] = per;
    obj.value = (parseInt(d.total) * percentage) / 100;
    obj["under"] = d.under;
});


it can be:

  var percentage = 0;
  objSet.data = objSet.data.map(function (obj) {
    obj.original = obj.value;
    obj.percentage = (parseInt(obj.value) * 100) / parseInt(objSet.total);
    percentage += obj.percentage;
    obj.value = (parseInt(objSet.total) * percentage) / 100;
    obj.under = objSet.under;
    return obj;
  });


EDIT after realizing it could be yet more "compressed" using reduce() instead of map():

  objSet.data.reduce(function (percentage, obj) {
    obj.original = obj.value;
    obj.percentage = (parseInt(obj.value) * 100) / parseInt(objSet.total);
    percentage += obj.percentage;
    obj.value = (parseInt(objSet.total) * percentage) / 100;
    obj.under = objSet.under;
    return return percentage;
  }, 0);


It can be seen as a strange way using reduce(): it's usually employed to give a final result, while here it only avoids declaring a temporary variable for percentage.
Also strange, at first view, is that we keep getting a modified version of objSet.data without map(), because it is directly set.

Finally the third step can take advantage of concat to again avoid using $.each(), so this:

d.data.sort(function (a, b) { return b.value - a.value; });
$.each(d.data, function (j, obj) {
    tempData.push(obj);
});


becomes:

  objSet.data.sort(function (a, b) { return b.value - a.value; });
  result = result.concat(...objSet.data);


To summarize, the whole code can be reduced to this:

var result=[];
$.each(source, function (index, objSet) {

  objSet.total = objSet.data.reduce((total, obj) =&gt; total + parseInt(obj.value), 0);

  objSet.data.reduce(function (percentage, obj) {
    obj.original = obj.value;
    obj.percentage = (parseInt(obj.value) * 100) / parseInt(objSet.total);
    percentage += obj.percentage;
    obj.value = (parseInt(objSet.total) * percentage) / 100;
    obj.under = objSet.under;
    return return percentage;
  }, 0);

  objSet.data.sort(function (a, b) { return b.value - a.value; });
  result = result.concat(...objSet.data);
});