<!DOCTYPE html>
<html>
<body>

<p id="demo" onclick="fce()">Click me to change my HTML content (innerHTML).</p>

<script>
Array.prototype.sortOn = function(key){
    this.sort(function(a, b){
        if(a[key] < b[key]){
            return -1;
        }else if(a[key] > b[key]){
            return 1;
        }
        return 0;
    });
}



var arr = [{name:'bob', artist:'rudy'},{name:'johhny', artist:'drusko'},{name:'tiff', artist:'needell'},{name:'top', artist:'gear'}];

arr.sortOn("name");
arr.sortOn("artist");

function fce(){
  
  arr.sortOn("artist");
  document.getElementById("demo").innerHTML = arr[0].name;
}

function fce2(){
	arr.sortOn("name");
}


function myFunction() {
    document.getElementById("demo").innerHTML = "Paragraph changed!";
}
</script>

</body>
</html> 
