avermeulen · June 7, 2018 08:35
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
    <style media="screen">
      .name {
        font-size: 2em;
      }
    </style>
  </head>
  <body>
    <div class="name">

    </div>

    <input type="text" name="" value="" class="enterName">
    <button type="button" name="button" class="addBtn">Add name</button>

  </body>
  <script src="index.js" charset="utf-8"></script>
 </html>
diff --git a/index.js b/index.js
 var nameElem = document.querySelector('.name');
 var addBtn = document.querySelector('.addBtn');
 var enterNameElem = document.querySelector('.enterName');

 // var names = ['Banele', 'Yegan', 'Phindi'];
 // console.log(JSON.stringify(names));

 var map = {
  "Banele" : 6,
  "Andre" : 3
 }

 localStorage['map'] = JSON.stringify(map);

 var myNames = [];

 // take the names from localStorage
 if (localStorage['myNames']){
  myNames = JSON.parse(localStorage['myNames']);
 }
 // then print them on the screen
 for (var i = 0; i < myNames.length; i++) {
  var name = myNames[i];
  addName(name);
 }


 addBtn.addEventListener('click', function(){
  var theName = enterNameElem.value;
  addName(theName);
  myNames.push(theName);
  localStorage['myNames'] = JSON.stringify(myNames);
 });

 function addName(name){
  nameElem.innerHTML += name + "<br>"
 }


 var names = JSON.parse(localStorage['name']);

 for (var i = 0; i < names.length; i++) {
  var name = names[i];
  console.log(name);
 }

 // nameElem.innerHTML = ;
diff --git a/localstorage.md b/localstorage.md
	<!DOCTYPE html>
	<html lang="en" dir="ltr">
	<head>
	<meta charset="utf-8">
	<title></title>
	<style media="screen">
	.name {
	font-size: 2em;
	}
	</style>
	</head>
	<body>
	<div class="name">

	</div>

	<input type="text" name="" value="" class="enterName">
	<button type="button" name="button" class="addBtn">Add name</button>

	</body>
	<script src="index.js" charset="utf-8"></script>
	</html>
	var nameElem = document.querySelector('.name');
	var addBtn = document.querySelector('.addBtn');
	var enterNameElem = document.querySelector('.enterName');

	// var names = ['Banele', 'Yegan', 'Phindi'];
	// console.log(JSON.stringify(names));

	var map = {
	"Banele" : 6,
	"Andre" : 3
	}

	localStorage['map'] = JSON.stringify(map);

	var myNames = [];

	// take the names from localStorage
	if (localStorage['myNames']){
	myNames = JSON.parse(localStorage['myNames']);
	}
	// then print them on the screen
	for (var i = 0; i < myNames.length; i++) {
	var name = myNames[i];
	addName(name);
	}


	addBtn.addEventListener('click', function(){
	var theName = enterNameElem.value;
	addName(theName);
	myNames.push(theName);
	localStorage['myNames'] = JSON.stringify(myNames);
	});

	function addName(name){
	nameElem.innerHTML += name + "<br>"
	}


	var names = JSON.parse(localStorage['name']);

	for (var i = 0; i < names.length; i++) {
	var name = names[i];
	console.log(name);
	}

	// nameElem.innerHTML = ;