Online notepad in JavaScript

I have been told for my code below i need to "Improve and optimise the codebase of the application to reflect modern and best coding practices". Can anyone help me in doing this? As I know the service worker code can't be optimised so I am not sure what other code I can change/improve for best coding practices. The HTML page attached to this is mainly just buttons.



`//Make IE play nice with HTML5 elements
document.createElement('header');
document.createElement('section');
document.createElement('article');
document.createElement('footer');

// ServiceWorker is a progressive technology. Ignore unsupported browsers
if ('serviceWorker' in navigator) {
console.log('CLIENT: service worker registration in progress.');
navigator.serviceWorker.register('/service-worker.js').then(function() {
console.log('CLIENT: service worker registration complete.');
}, function() {
console.log('CLIENT: service worker registration failure.');
});
} else {
console.log('CLIENT: service worker is not supported.');
}

var notepad = {
notes:[]
};

var currentNoteKey,
viewEdit,
viewList,
noteTitleElement,
noteContentElement;

function createNote(){
//Create a blank new note
var newNote = {
'name':'New Note',
'content':'Hello World',
'last-modified':+new Date()
}

//Add the note to the array, and keep track of it's key
var newNoteKey = 0;
while(typeof notepad.notes[newNoteKey] !== 'undefined'){
newNoteKey++;
}
currentNoteKey = newNoteKey;
notepad.notes[newNoteKey] = newNote;

//Redraw the list of notes, and show the edit view
drawNotesList();
changeView();
}

function drawNotesList(){
//Sort the notes by most recently modified first
notepad.notes.sort(function(a,b){
if(a['last-modified'] b['last-modified']){
return -1;
}else{
return 0;
}
});

//Generate & Apply the HTML
var notesList = '';
for(key in notepad.notes){
var thisNote = notepad.notes[key];
notesList += '

• ' + thisNote.name + '';

}
if(notesList == ''){
notesL

Javascript developers don't like to put hardly anything on the global scope.

To achieve this, surround your script in an auto running function.

(function scope() {
// your variables and functions go here
})();

If you really need to put something in the global scope (there are only very few cases where this applies), put it inside an object:

var globalVariables = {
    variable1: 1,
    variable2: []
}

Then you can acces it by doing

globalVariables.variable1; // returns 1

When you want to access a variable in the closure, return a function from it.

var sayHello = (function() {
      var closureVariable = "hello";
      return function() {return closureVariable;};
 })();
 sayHello(); //returns hello

Side note: DOCTYPE should be uppercase

StackExchange Code Review Q#128065, answer score: 2