Which four actions should you perform in sequence?

DRAG DROP
You develop an HTML5 webpage. You have the following HTML markup:

You also have the following JavaScript variable defined:
var languages = [];
You need to add statements to an existing JavaScript function to sort the list items.
Which four actions should you perform in sequence? (Develop the solution by selecting the required
code segments and arranging them in the correct order.)

Answer: See the explanation.

Explanation:

Box 1:

Box 2:

Box 3:

Box 4:

Note:
* getElementsByTagName
The getElementsByTagName() method accesses all elements with the specified tagname.
* Example:

// Get the list items and setup an array for sorting
var lis = ul.getElementsByTagName("LI");
var vals = [];
// Populate the array
for(var i = 0, l = lis.length; i < l; i++)
vals.push(lis[i].innerHTML);
// Sort it
vals.sort();
// Sometimes you gotta DESC
if(sortDescending)
vals.reverse();
// Change the list on the page
for(var i = 0, l = lis.length; i < l; i++)
lis[i].innerHTML = vals[i];
}