Javascript game - collision detection on ball hit

Yea, i'm trying to make easy game, i'm newbie and i think it's getting too hard for me, i don't know if i made some mistake in that if in collisionDetection() function, everything is fine except this function.

<!DOCTYPE html>
<html>
<head>
	<title>GAME</title>
	<meta charset="utf-8"/>
	<style type="text/css">
		canvas {
			background-color: gray;
		}
	</style>
</head>
<body>
	<canvas width="500" height="500" id="myCanvas"></canvas>
	
	<script type="text/javascript">
		var canvas = document.getElementById('myCanvas');	
		var ctx = canvas.getContext('2d');

		var ballX = canvas.width / 2;
		var ballY = canvas.height - 80;
		var ballR = 10;
		var ballMX = 2;
		var ballMY = -2;
		var paddleX = 130;
		var paddleY = 15;
		var paddleW = (canvas.width / 2) - (130 / 2);
		var paddleH = canvas.height - paddleY;
		var rightPressed = false;
		var leftPressed = false;
		var tileStatus = true;
		var tile = [];
		var tileLeftSpace = 14;
		var tileTopSpace = 30;
		var tileRows = 5;
		var tileColumns = 20;
		var tilePadding = 16;
		var tileWidth = 10;
		var tileHeight = 10;

		for(j = 0; j < tileRows; j++) {
			tile[j] = [];
			for(i = 0; i < tileColumns; i++) {
				tile[j][i] = {x: 10, y: 10, status: 1};
			}
		}

		document.addEventListener("keydown", keyDownHandler, false);
		document.addEventListener("keyup", keyUpHandler, false);

		function keyDownHandler(e) {
			if(e.keyCode == 39) {
				rightPressed = true;
			} else if(e.keyCode == 37) {
				leftPressed = true;
			}
		}

		function keyUpHandler(e) {
		    if(e.keyCode == 39) {
		        rightPressed = false;
		    }
		    else if(e.keyCode == 37) {
		        leftPressed = false;
			}
		}

		function collisionDetection() {
			for(i = 0; i < tileRows; i++) {
				for(j = 0; j < tileColumns; j++) {
					var t = tile[i][j];
                    if(t.status == 1) {
					    if(ballX > t.x && ballX < t.x + tileWidth && ballY + ballR > t.y && ballY + ballR < t.y + tileHeight) {
						    ballMY = -ballMY;
						    t.status = 0;
                        }
					}
				}
			}
		}

		function drawBall() {
			ctx.beginPath();
			ctx.arc(ballX, ballY, ballR, 0, 2 * Math.PI);
			ctx.fillStyle = "blue";
			ctx.fill();
			ctx.closePath();
		}

		function drawTiles() {
			for(j = 0; j < tileRows; j++) {
				for (i = 0; i < tileColumns; i++) {
					if(tile[j][i].status == 1) {
						var tileX = i * (tileWidth + tileLeftSpace);
						var tileY = j * (tileHeight + tileTopSpace);
						tile[j][i].x = tileX;
						tile[j][i].y = tileY;
						ctx.beginPath();
						ctx.fillStyle = "orange";
						ctx.rect(tile[j][i].x + tilePadding, 
							tile[j][i].y + tilePadding, tileWidth, tileHeight);
						ctx.fill();
						ctx.closePath();
					}
				}
			}
			
		}

		function drawPaddle() {
			ctx.beginPath();
			ctx.fillStyle = "green";
			ctx.rect(paddleW, paddleH, paddleX, paddleY);
			ctx.fill();
			ctx.closePath();
		}

		function draw() {
			ctx.clearRect(0, 0, canvas.width, canvas.height);
			drawBall();
			drawPaddle();
			drawTiles();
			collisionDetection();

			ballX += ballMX;
			ballY += ballMY;

			if(ballY - ballR <= 0) {
				ballMY = -ballMY;
			} else if(ballY + ballR > canvas.height - paddleY) {
				if(ballX > paddleW && ballX < paddleW + paddleX) {
					ballMY = -ballMY;
				} else if(ballY + ballR == canvas.height) {
					alert("GAME OVER");
					document.location.reload();
				}
			} else if(ballX + ballR > canvas.width || ballX - ballR < 0) {
				ballMX = -ballMX;
			} 

			if(rightPressed && paddleW < canvas.width - paddleX) {
				paddleW += 5;
			} else if(leftPressed && paddleW > 0) {
				paddleW -= 5;
			}

			requestAnimationFrame(draw);
		}

		

		draw();
	</script>
</body>
</html>