js与jquery对象互转

<input class="btn" type="button" value="显示/隐藏">
<br>
<div class="box"></div>

    $("input").click(function () {
        if($(".box").is(":visible")){
            //todo  jq对象转js
            $(".box")[0].style.display = "none";
//            $(".box").hide();
        }else{
            $(".box")[0].style.display = "block";
//            $(".box").show();
        }
    })

    var btn = document.getElementsByClassName("btn");
    var box = document.getElementsByClassName("box");
    $(".btn").click(function () {
        if($(box).is(":visible")){   //todo js对象转jquery对象
            $(".box").hide();
        }else{
            $(".box").show();
        }
    })