How to Get the Children of the $(this) Selector in jQuery
source link: https://www.laravelcode.com/post/how-to-get-the-children-of-the-this-selector-in-jquery
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
How to Get the Children of the $(this) Selector in jQuery
Use the jQuery find()
Method
You can use the find()
method to get the children of the $(this)
selector using jQuery.
The jQuery code in the following example will simply select the child <img>
element and apply some CSS style on it on click of the parent <div>
element.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery Select the Child Element Inside a DIV On Click</title>
<style>
.box{
padding: 80px;
border: 10px solid #999;
text-align: center;
}
.box img{
width: 400px;
border: 6px solid #999;
}
</style>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
$(document).ready(function(){
$(".box").click(function(){
$(this).find("img").css("border-color", "blue");
});
});
</script>
</head>
<body>
<div class="box">
<img src="images/sky.jpg" alt="Cloudy Sky">
</div>
</body>
</html>
Author : Harsukh Makwana
Hi, My name is Harsukh Makwana. i have been work with many programming language like php, python, javascript, node, react, anguler, etc.. since last 5 year. if you have any issue or want me hire then contact me on [email protected]
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK