Selecting elements with Jquery | styling html elements with Jquery

We’ll be looking on how to select a HTML element lets say for instance an <h1> tag and change the background color and the font color when clicking it, let’s get started.
To select an element in Jquery we simply pass the element’s name as a string parameter to the $ function (note the $ symbol is the short form for Jquery). Here is how the code will look

Styling elements with jquery

<script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
$(this).css('background-color','#F00')//setting a background color
$(this).css('color','#fff') // setting font solor
});//click function end
});//document ready function end

<h1>click me and change the Background</h1>

h1{ border: 1px solid #999; border-radius:5px; width:510px; cursor: pointer;}


Popular posts from this blog

How CSS3 Works