I am new to jQuery. I am trying to create this simple effect but its not generating any output. Please tell me why its not working.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" href="style.css" >
</head>
<body>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" ></script>
<script type="text/javascript" src="table.js" ></script>
<div class="table">
<p>MyPara</p>
<p>MyPara2</p>
<p>MyPara3</p>
</div>
</body>
table.js
// JavaScript Document
$(document).ready(function() {
$('table').addClass('highlight');
});
Stylesheet
.highlight
{
background-color:#999;
}
You have to use . before class name. Here you are missing it. Your code should be like this.
$(document).ready(function() {
$('.table').addClass('highlight');
});
you need to use . for class, change:
$('table').addClass('highlight');
to
$('.table').addClass('highlight');
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With