New Project My Counter App - Working on Undo button Still Working

let count = 0;

	// select buttons and value
	const value = document.querySelector("#value");
	const btns = document.querySelectorAll(".btn");

	function doUndo (numberIs) {
	numberIs = count;
	return numberIs;
	}

	// console.log(btns);
	btns.forEach(function (btn) {
	btn.addEventListener("click", function(e) {
	const styles = e.currentTarget.classList;
	// let previous = count;
	// console.log(pervious);
	if (styles.contains('decrease')) {
	count--;
	// console.log(count);
	}
	else if (styles.contains('increase')) {
	count++;
	// console.log(count);
	}
	else if (styles.contains('reset')) {
	count = 0;
	}
	else if (styles.contains('ten')) {
	count += 10;
	}
	else if (styles.contains('hundred')) {
	count += 100;
	}
	else if (styles.contains('minten')) {
	count -= 10;
	}
	else if (styles.contains('undo')) {
	// count = numberIs();
	console.log(numberIs());


	// Working ...
	} if (count > 0) { value.style.color = 'green'; } if (count < 0) { value.style.color = 'red'; } if (count == 0) { value.style.color = '#222'; }
	value.textContent = count;
	})
	});

<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>Counter App</title>
	<link rel="stylesheet" href="styles.css" />

	</head>

	<body>
	<main>
	<div class="container">
	<h1>My Counter</h1>
	<span id="value">0</span>
	<div class="button-container">
	<button class="btn decrease">decrease</button>
	<button class="btn reset">reset</button>
	<button class="btn increase">increase</button>
	</div>

	<div>
	<button class="btn ten">+ 10</button>
	<button class="btn hundred">+ 100</button>
	<button class="btn minten">- 10</button>
	</div>
	<div>
	<!-- <button class="btn undo">undo</button> -->
	</div>
	<div>
	</div>
	</main>
	<script src="app.js"></script>
	</body>

	</html>

body {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: aliceblue;
	}

	.container h1 {
	font-family: Georgia, 'Times New Roman', Times, serif;
	font-size: 2rem;
	}

	.container {
	text-align: center;
	}

	span {
	font-size: 7rem;
	color:black;
	}

	.btn {
	font-family: Georgia, 'Times New Roman', Times, serif;
	background: transparent;
	letter-spacing: 0.1rem;
	font-size: 1rem;
	font-weight: 400;
	transition: all 0.3s linear;
	border-radius: 0.4rem;
	border: 2px solid #222;
	display: inline-block;
	cursor: pointer;
	margin-left: 0.3rem;
	padding: 0.25rem 0.75rem;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	margin-bottom: 0.7rem;
	}


	.btn:hover {
	color: whitesmoke;
	background: black;
	transform: scale(1.1);
	}

	.links {
	display: flex;
	}

	.links h3 {
	margin-top: 7rem;
	}

	.clickMe {
	font-family: Georgia, 'Times New Roman', Times, serif;
	background: transparent;
	letter-spacing: 0.1rem;
	font-size: 1rem;
	font-weight: 400;
	transition: all 0.3s linear;
	border-radius: 0.4rem;
	border: 2px solid #222;
	display: inline-block;
	cursor: pointer;
	margin-left: 0.3rem;
	padding: 0.25rem 0.75rem;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
	margin-bottom: 0.7rem;
	}

	.clickMe:hover {
	color: whitesmoke;
	background: #A52A2A;
	transform: scale(1.1);
	}

meditationprogrammer