Untitled

<html>
	<head>
		<meta charset="UTF-8">
		<title>reverse tug a war</title>
	</head>
	<body>

		<header>
			<h1>TWO CAGES ENTER ONE CAGE LEAVES</h1>
			<div class="dropdown">
		</header>

		<section class="theCages">
			<div class="cageOne">
				<img src="cage-Img-alive/happyCage.jpg" alt="happy cage">
				<h2>Health :</h2>
				<h3 id="health1"></h3>
				<button type="button" class="btn btn-danger attack" id="btn1" data-cage="1">ATTACK</button>
			</div>
			<div class="cageTwo" id="btn2">
				<img src="cage-Img-alive/stunnedCage.jpg" alt="happy cage">
				<h2>Health :</h2>
				<h3 id="health2"></h3>
				<button type="button" class="btn btn-danger attack" data-cage="2">ATTACK</button>
			</div>
		</section>

		<script src="cage.js" type="text/javascript"></script>
	</body>
</html>