Changing div background color with click

Question

So. I have 2 input (x,y) and when press submit code is draw divs (example: 5x5). I want to change divs background color when div is clicked.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Feladat10</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<form method="post">
    <input type="text" name="x"/>
    <input type="text" name="y"/>
    <input type="submit" name="submit"/>
</body>
</html>

<?php
if(isset($_POST['submit']))
{
    $x = $_POST['x'];
    $y = $_POST['y'];
    echo "<br/>";
    for($i=1; $i <= $x; $i++)
    {
        echo "<br/><div class='tile'>".$i."</div>";
        for($j=1; $j < $y; $j++)
        {
            echo "<div class='tile'>".$j."</div>";
        }
    }
}
?>

Im trying with this code:

<script>
    $(function () {
        $(".tile").click(function () {
            $(this).css('background-color', '#000000');
        });
    });
</script>

But its not working. Any ideas how can I fix this?

You will get this error when you not included your jquery file or when you included your jquery file after your script — Rajashekhar, Jan 03 '17 at 09:42
holy ****, big mistake, thank you :) now working fine, dunno how i forget this :/ — , Jan 03 '17 at 09:53

score 1 · Accepted Answer · edited Jan 03 '17 at 10:08

1

Just add the jquery.min.js file in appropriate position.

<script>
    $(function () {
        $(".tile").click(function () {
           $(this).css("background-color","black");
         });
      });
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div class='tile'>one</div>
<div class='tile'>two</div>

edited Jan 03 '17 at 10:08

Sanooj T

1,264
1
13
24

answered Jan 03 '17 at 09:44

Nishant Saini

446
3
13

score 0 · Answer 2 · answered Jan 03 '17 at 09:44

0

I can not find jquery attached to your html file

answered Jan 03 '17 at 09:44

Var Yan

96
4

Put this inside your head tags – Var Yan Jan 03 '17 at 09:46

Changing div background color with click

2 Answers2