How to remove the overlay of a specific div?

0

I have the following code that will create delimiters ( target ) according to the past coordinates. But I wanted these targets to remove the overlay

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><style>.square{height:515px;width:494px;margin-top:42px;}body{}#overlay{position:fixed;display:block;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2;cursor:pointer;}</style><scripttype="text/javascript">
window.onload = function() {

	var x, y, w, h; 
    //y = TOP - medidas em %;
    //x = LEFT - medidas em %;
	var coordenadas = 
	[
				{w: 400, h: 400, x: 10, y: 10},
				{w: 100, h: 100, x: 50, y: 50}
	];
	changeSquare(coordenadas);
	

	
};  
    function changeSquare(coordenadas){ 
	 for (let i = 0; i < coordenadas.length; i++) {	 
	 var div= document.createElement("div");
	 div.setAttribute( "id", i);
	 div.setAttribute("style","top:" + coordenadas[i].y + "%" + ";" + "left:" + coordenadas[i].x + "%" +  ";" +  "height:" +  coordenadas[i].h + "px" + ";" 
                     +  "width:" +  coordenadas[i].w + "px" + ";" + "position: absolute; border: red solid 3px; z-index: 999");
	 document.body.appendChild(div);
	}
    
}

</script>
</head>
<body background="https://i.stack.imgur.com/sy2ru.png">
<div id="overlay"></div>

<div class="square" id="square">
<!-- <img src="C:\Users\igor.carreiro\Pictures\interface.png"   height="515px" width="494px"> -->
</div>

</body>
</html> 
    
asked by anonymous 01.11.2018 / 16:53

0 answers