Comparison/sort function gives no results

JavaScript
1

Using the book, “Professional JavaScript for Web Developers,” I’m working on integrating the following sorting code, but there are no results or errors in the console:

function colorsCompare(value1, value2) {
	var colors = (value1 - value2);
	return colors;
}

In the body I have a div for inserting the result:

<div id="arrayStuff" style="padding:1em; margin: 1em;background-color: #eee; border-radius: 6px;">&nbsp;</div>

I use this script to allow the user to add to an array called colors and show it in the above div:

<script>
colors = [],
form = document.getElementById('formColor');
(function sampleArray() {
	"use strict";

	form.addEventListener("submit", function(e) {
	    e.preventDefault(); // prevents the form from submitting
		var newColor = formColor.newColorInput.value;
		colors.push(newColor);
			fillArrayStuff();
	}, false);
})();

</script>

On clicking the Go button, these functions get called, and they are supposed to sort numbers into natural sort order:

function fillArrayStuff() {
	document.getElementById('arrayStuff').innerHTML = "Array: " + colors.join(', ');
}

function colorsCompare(value1, value2) {
	var colors = (value1 - value2);
	return colors;
	fillArrayStuff();
	// not working
}


<button onClick="colorsCompare();">Sort numerical array order</button>

I am successfully able to remove the first array item, reverse the array order, sort the array order digitally, and give an alert for which numbers are higher than 20. But this code I haven’t gotten to work. The book is pretty sparse usage with regards to user-generated content. What is missing from the code?

2

Found an answer that works. Replace the above function colorsCompare with this:

function colorsCompare() { "use strict";
    var item = colors.sort(function(a,b) { return parseFloat(a) - parseFloat(b) } );
    fillArrayStuff();
}