jQuery draggable having 2 handles

Question

Only some of my child elements gets selected why not all of them ? Is this a jquery bug or is my selector wrong ? I'm trying to select all child elements in two div one inside the other.Here are my jquery and html codes:

    $("#friendlistdiv1").draggable({ handle: "friendlistdiv>*" });
    $("#friendlistdiv1").draggable({ handle: "friendlistdiv1>*" });


<div id="friendlistdiv1">
    <div id="blackbc">
    <input id="friendbutton1"class="menuboutons" type="button" value="Minimize friend list ">
       <img  id="xboutonfriendlist" src="images/xbouton.png" alt="an X button" title="This button will   close this window."/>
    </div>
    <div id="friendlistdiv">

    <div> 
                <p>
                          there is more stuff here in the real code
               </p>
    </div>
    <form action="addfriend.php" method="post">
    <input id="friendlistadd" name="addfriend" type="text" value="Add friend">
    <input id="smallbutton" class="menuboutons" type="submit" value="Add friend" />
    <form>  
</div>

Answer 1

Try with this :

 $("#friendlistdiv1").draggable({ handle: "#friendlistdiv,#friendlistdiv1" });

Another Option :

Assign a class to which you want, make handler:

$("#friendlistdiv1").draggable({ handle: ".dragelem" });