Issue
When adding the class "playing" then I will add the next li tag custom CSS. Please read my code, my you understand
See my code.
<ul>
<li class="playing">li (sibling)</li>
<li id="head">li <b class="block">(sibling)</b></li>
<li>li (sibling with class name "start")</li>
<li>li (the next sibling of li with class name "start")</li>
<li>li (sibling)</li>
</ul>
JQuery :
$(".playing").next("#head .block").css({"color": "red", "border": "2px solid red"});
Jquery not working next() property :(
Solution
.next
returns the related sibling on same level. .block
is the child of #head
and is not on same level.
Use find
after next
in this way:
$(".playing").next("#head")
.find(".block")
.css({"color": "red", "border": "2px solid red"});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li class="playing">li (sibling)</li>
<li id="head">li <b class="block">(sibling)</b></li>
<li>li (sibling with class name "start")</li>
<li>li (the next sibling of li with class name "start")</li>
<li>li (sibling)</li>
</ul>
Answered By - kiddorails Answer Checked By - Willingham (PHPFixing Volunteer)
0 Comments:
Post a Comment
Note: Only a member of this blog may post a comment.