Aspdotnet-Suresh

aspdotnet-suresh offers C#.net articles and tutorials,csharp dot net,asp.net articles and tutorials,VB.NET Articles,Gridview articles,code examples of asp.net 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

jQuery Get Elements with Id or CSS Class Name with Example

Mar 19, 2015
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.

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 RSS subscribe by email Subscribe by Email

0 comments :

Give your Valuable Comments

Other Related Posts

© 2015 Aspdotnet-Suresh.com. All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.