Jquery Class Selector
Class name selector select all all html element tag with specify class name
if document have more than one with same class name it select all whose element which have same class name
Syntax for Class Name Selector
$(".class Name")
Example
<DOCTYPE html>
<head>
<title> class name selector</title>
<script src="path of jquery downloaded folder"></script>
</head>
<body>
<p class="demo"> learn class name selector all element tag which have same name </p>
<script>
$(document).ready(function(){
var innerHtml = $(".demo").html(); // html function return innerHTML
console.log(innerHtml);
})
</script>
</body>
</html>
Result
Select multiple class name with same class name
<body>
<p id="demo"> This is paragraph with demo class name</p>
<p id="demo"> Select multiple class with name </p>
<script>
$(document).ready(function(){
var text = $(".demo").html(); // select both p tag with class name demo like an array
console.log(text[0]);
console.log(text[1]);
})
</script>
</body>
Result
This is paragraph with demo class name
Select multiple class with name
Get and Set innerHTML by Class Name
Tips : You can get innerHTML of element by html() function
Tips :You can set innerHTML of element by html() function
Example
<body>
<p class="demo">This is paragraph tag </p>
<h1 class="test"></h1>
<script>
$(document).ready(function(){
// first we get innerHTML
var text = $(".demo").html();
// Now set the text in heading tag
var head = $(".test").html(text);
alert(head);
})
</script>
</body>
