I have this code in JS to jQuery:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<title>test</title>
</head>
<body>
<ul id="ul1">
<li id="li11">11</li>
<li id="li12">12</li>
<li id="li13">13</li>
</ul>
<ul id="ul2">
<li id="li21">21</li>
<li id="li22">22</li>
<li id="li23">23</li>
</ul>
<pre id="result"></pre>
</body>
</html>
<script>
$(function(){
var liFind = $("#li21");
var liFindDoc = document.getElementById("li21");
var ul1 = $("#ul1");
var ul2 = $("#ul2");
$("#result").append( "li exist: "+$(liFind).length+", "+$(liFind).html()+"<br />");
$("#result").append( "find ul 1 : "+$(ul1).find(liFind).length+"<br />");
$("#result").append( "find ul 2 : "+$(ul2).find(liFind).length+"<br />");
$("#result").append( "children ul 1 : "+$(ul1).children(liFind).length+"<br />");
$("#result").append( "children ul 2 : "+$(ul2).children(liFind).length+"<br />");
$("#result").append( "filter ul 1 : "+$(ul1).filter(liFind).length+"<br />");
$("#result").append( "filter ul 2 : "+$(ul2).filter(liFind).length+"<br />");
$("li").each(function(i,val){
$("#result").append("li "+$(val).attr("id")+": "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$(ul1).children().each(function(i,val){
$("#result").append("children II ul 1 : "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$(ul2).children().each(function(i,val){
$("#result").append("children II ul 2 : "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$(ul1).find("li").each(function(i,val){
$("#result").append("find II ul 1 : "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$(ul2).find("li").each(function(i,val){
$("#result").append("find II ul 2 : "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$("#result").append("'SOLUTION' ::: closest li->ul: "+ $(liFind).closest('ul').attr("id") +"<br />");
});
</script>
and get this result:
- 11
- 12
- 13
- 21
- 22
- 23
li exist: 1, 21
find ul 1 : 0
find ul 2 : 0
children ul 1 : 3
children ul 2 : 3
filter ul 1 : 0
filter ul 2 : 0
li li11: false - false
li li12: false - false
li li13: false - false
li li21: false - true
li li22: false - false
li li23: false - false
children II ul 1 : false - false
children II ul 1 : false - false
children II ul 1 : false - false
children II ul 2 : false - true
children II ul 2 : false - false
children II ul 2 : false - false
find II ul 1 : false - false
find II ul 1 : false - false
find II ul 1 : false - false
find II ul 2 : false - true
find II ul 2 : false - false
find II ul 2 : false - false
'SOLUTION' ::: closest li->ul: ul2
Question How can I tell if an element is in a context, for example in the case above, as whether a "li" is in a "ul"? with jQuery using a method such as "find".