Jq failed to get child elements of operation?


< html lang= "en" >
< head >

<meta charset="UTF-8">
<title>Title</title>

< / head >
< body >

<ul id="uls">
   <li>
       <dl>
           <dt>11</dt>
           <dd style="display: none;" class="db1">22</dd>
           <dd>33</dd>
       </dl>
   </li>
    <li>
        <dl>
            <dt>1122</dt>
            <dd style="display: block;" class="db1">2233</dd>
            <dd>3344</dd>
        </dl>
    </li>
    <li>
        <dl>
            <dt>112233</dt>
            <dd style="display: block;" class="db1">223344</dd>
            <dd>334455</dd>
        </dl>
    </li>
</ul>

< / div >
< button id= "btn" > Click < / button >
< script type= "text/javascript" src= "js/jquery-2.1.4.min.js" > < / script >
< script type= "text/javascript" >

    $(function () {
        $("-sharpbtn").click(function () {
            console.log($("-sharpuls li")[1]);
            $("-sharpuls li")[1].children().children(".db1").css({"color":"red"});

           for(var i=0;i<$("-sharpuls li").length;iPP){
                var s= $("-sharpuls li")[i].children().childern("db1");
                if(s.css("display")=="none"){
                    $("-sharpuls li")[i].css({"display":"none"});
                }
            }

        });
    })

< / script >
< / body >

I want to determine whether the displayvalue of the class element named bd1 in all the dt under Li is none, when I click the button. If this ls is hidden, I wrote about how to report an error all the time. Thank you!


$("- sharpbtn") .click (function () {

$("-sharpuls li").each(function(){
    if($(this).find(".db1").css("display")=='none'){
       $(this).css("display","none"); 
    }
});

});


console.log($("-sharpuls li")[1].children[0].children[1]);
$("-sharpuls li")[1].children[0].children[1].style.color="red";

$("-sharpbtn").click(function () {
    $("-sharpuls li").each(function(){
        if($(this).find(".db1").is(":hidden")){
           $(this).show(); 
        }
    });
});
Menu