voidnerd/arraypushupdatehtml.html

## arraypushupdatehtml.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div title="ok" id="oked"></div>
    <input type="text" id='ok' >

    <script>

           function generateList() {
                let list = "<ul>";

                for(i =0; i < foods.length; i++) {
                    list += "<li>" + foods[i] + "</li>";
                    console.log(list)

                }
                list += "</ul>";

                return list;
           }

           //
            var div = document.querySelector('#oked');
            var input = document.querySelector('#ok');


           let foods = ['rice', 'beans', "garri"];

           let list = generateList();

           div.innerHTML = list;

           input.addEventListener('keydown', function(e) {

               if(e.key == 'Enter') {
                div.innerHTML = "";

                foods.push(input.value);

                list = "";

                list = generateList();

                div.innerHTML = list;

               }
           });


    </script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Document</title>
	</head>
	<body>
	<div title="ok" id="oked"></div>
	<input type="text" id='ok' >

	<script>

	function generateList() {
	let list = "<ul>";

	for(i =0; i < foods.length; i++) {
	list += "<li>" + foods[i] + "</li>";
	console.log(list)

	}
	list += "</ul>";

	return list;
	}

	//
	var div = document.querySelector('#oked');
	var input = document.querySelector('#ok');


	let foods = ['rice', 'beans', "garri"];

	let list = generateList();

	div.innerHTML = list;

	input.addEventListener('keydown', function(e) {

	if(e.key == 'Enter') {
	div.innerHTML = "";

	foods.push(input.value);

	list = "";

	list = generateList();

	div.innerHTML = list;

	}
	});







	</script>
	</body>
	</html>