task2.html

<html>
<head>
	<title></title>
	<style>
	   #first {
	   	width: 300px;
	   	height: 300px;
	   	border: 5px solid black;
	   }
	   #second {
        width: 300px;
	   	height: 300px;
	   	border: 5px solid black;
	   }
	   </style>
</head>
<body>
	<div id="first"></div>
	<button id="button1" onclick="myFunction()">Make Green</button>

  	<div id= "second"></div>
  	<button id="button2" onclick="myFunction1()">Make Red</button>

  <script type="text/javascript">
  function myFunction() {
 	document.getElementById("first").style.backgroundColor = "Green";
  }
  function myFunction1 () {
  	   document.getElementById("second").style.backgroundColor="Red";
  }

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