jQuery – How to get element with CSS class name and id

In jQuery, you can get elements with CSS class name and id easily.

For example,

1. ID: #id

  • $(‘#idA’) – selects all elements that have an id of ‘idA’, regardless of its tag name.
  • $(‘div#idA’) – selects all div elements that has an id of ‘idA’.

2. Class: .classname

  • $(‘.classA’) – selects all elements that have an class name of ‘classA’, regardless of its tag name.
  • $(‘div.classA’) – selects all div elements that has an class name of ‘classA’.

Full Example

<html>
<head>
<title>jQuery Get element with class name and id</title>
 
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
 
</head>
 
<script type="text/javascript">
 
$(document).ready(function(){
 
    var $element = $('.classABC').html();
    alert($element);
 
    var $element = $('#idABC').html();
    alert($element);
 
});
 
</script>
<body>
 
<h1>jQuery Get element with class name and id</h1>
 
	<div class="classABC">
		This is belong to 'div class="classABC"' 
	</div>
 
	<div id="idABC">
		This is belong to 'div id="idABC"'
	</div>
 
</body>
</html>
Tags :

About the Author

mkyong
Founder of Mkyong.com and HostingCompass.com, love Java and open source stuff. Follow him on Twitter, or befriend him on Facebook or Google Plus. If you like my tutorials, consider make a donation to these charities.

Comments