I want to Change the background colour on click . This is my code work that i tried.pls help me out :)
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
$(document).ready(function(){
$(#co).click(change()
{
$(body).css("background-color":"blue");
});
});
Css code
body
{
background-color:red;
}
Body code
<body>
<div id="co" click="change()">
hello
</div>
This question is related to
javascript
jquery
html
css
$("#co").click(function(){
$(this).css({"backgroundColor" : "blue"});
});
1.Remove onclick method from div element
2.Remove function change() from jQuery code and in place of that create an anonymous function like:
$(document).ready(function()
{
$('#co').click(function()
{
$('body').css('background-color','blue');
});
});
You're using a colon instead of a comma. Try:
$(body).css("background-color","blue");
You also need to wrap the id in quotes or it will look for a variable called #co
$("#co").click(change()
There are many more issues here. click isn't an HTML attribute. You want onclick (which is redundant). Try this:
<div id="co"> <!-- no onclick method needed -->
<script>
$(document).ready(function() {
$("#co").click(function() {
$("body").css("background-color","blue"); //edit, body must be in quotes!
});
});
</script>
You were trying to call an undefined method. It looks like you were trying to declare it inside the callback statement? I'm not sure. But please compare this to your code and see the differences.
http://jsfiddle.net/CLwE5/ demo fiddle
Try below jQuery snippet, you can change color :
<script type="text/javascript">
$(document).ready(function(){
$("#co").click(function() {
$("body").css("background-color", "yellow");
});
});
</script>
$(document).ready(function(){_x000D_
$("#co").click(function() {_x000D_
$("body").css("background-color", "yellow");_x000D_
});_x000D_
});body {_x000D_
background-color:red;_x000D_
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>_x000D_
<div id="co" click="change()">hello</div>Try this
$("body").css({"background-color":"blue"});
Change Background Color using on click button jquery
Below is the code of jquery, which you can put in your head tag.
jQuery Code:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("div").addClass("myclass");
});
});
</script>
CSS Code:
<style>
.myclass {
background-color: red;
padding: 100px;
color: #fff;
}
</style>
HTML Code:
<body>
<div>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</div>
<button>Click Here</button>
</body>
The code below will change the div to blue.
<script>
$(document).ready(function(){
$("#co").click({
$("body").css("background-color","blue");
});
});
</script>
<body>
<div id="co">hello</div>
</body>
$("#bchange").click(function() {
$("body, this").css("background-color","yellow");
});
Source: Stackoverflow.com