How to get all child inputs of a div element (jQuery)

Question

HTML:

<div id="panel">
  <table>
    <tr>
       <td><input id="Search_NazovProjektu" type="text" value="" /></td>
    </tr>
    <tr>
       <td><input id="Search_Popis" type="text" value="" /></td>
    </tr>
  </table>
</div>

I need to select all inputs in the particular div.

This's not working:

var i = $("#panel > :input");

Answer 1

Use it without the greater than:

$("#panel :input");

The > means only direct children of the element, if you want all children no matter the depth just use a space.

Answer 2

You need

var i = $("#panel input"); 

or, depending on what exactly you want (see below)

var i = $("#panel :input"); 

the > will restrict to children, you want all descendants.

EDIT: As Nick pointed out, there's a subtle difference between $("#panel input") and $("#panel :input).

The first one will only retrieve elements of type input, that is <input type="...">, but not <textarea>, <button> and <select> elements. Thanks Nick, didn't know this myself and corrected my post accordingly. Left both options, because I guess the OP wasn't aware of that either and -technically- asked for inputs... :-)

Answer 3

var i = $("#panel input");

should work :-)

the > will only fetch direct children, no children's children
the : is for using pseudo-classes, eg. :hover, etc.

you can read about available css-selectors of pseudo-classes here: http://docs.jquery.com/DOM/Traversing/Selectors#CSS_Selectors