Introduction:
Here I will explain how to use jQuery to get elements with css class name or id with example. We can get elements (div) by using class name or id easily in jQuery.
Description:
In previous articles I explained best login page design using css, change button color on mouseover using css, jQuery add border to images using css classes, 8 best audio player plugin examples and many articles relating to css, AngularJS, jQuery, JavaScript and asp.net. Now I will explain how to use jQuery to get elements with css class name or id with example.
In previous articles I explained best login page design using css, change button color on mouseover using css, jQuery add border to images using css classes, 8 best audio player plugin examples and many articles relating to css, AngularJS, jQuery, JavaScript and asp.net. Now I will explain how to use jQuery to get elements with css class name or id with example.
To get elements with class name or
id using jQuery we need to write the
code like as shown below
Using
Id to get elements
<script type="text/javascript">
$(function () {
$('#btnGet').click(function () {
var idval = $('#testiddiv').html();
alert(idval)
});
})
</script>
|
Using
CSS Class Name to get elements
<script type="text/javascript">
$(function () {
$('#btnGet').click(function () {
var classval = $('.testcalss').html();
alert(classval)
});
})
</script>
|
If you want to check it in complete example you need to write the code like as shown below
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery Get elements
with id or css class names with example</title>
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript">
$(function () {
$('#btnGet').click(function () {
var idval = $('#testiddiv').html();
var classval = $('.testcalss').html();
alert(idval)
alert(classval)
});
})
</script>
</head>
<body>
<form id="form1">
<div id="testiddiv"
style="border:1px solid red; padding:10px">
Test Id Div
</div><br />
<div style="border:1px solid green; padding:10px" class="testcalss">
Sample Content Child Div</div>
<br />
<input type="button"
id="btnGet"
value="Get
Elements with Id or Class Name" />
</form>
</body>
</html>
|
Live
Demo
For live demo try to click on below button it will get
div elements based on id and class name and it will show details in alert box
Test Id Div
Sample Content Child Div
|
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
Subscribe by RSS
Subscribe by Email
|
|||
0 comments :
Note: Only a member of this blog may post a comment.