jQuery Method How to - Select certain element type in the same Div with find() method

Question

We would like to know how to select certain element type in the same Div with find() method.

Answer


<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'
  src='http://code.jquery.com/jquery-1.6.2.js'></script>
<script type='text/javascript'>
$(window).load(function(){<!--from   w  w w  .j a v  a2 s  .c  om-->
    $(document).ready(function () {
        $('.clearButton').click(function () {
           $(this).parent().find('input').val('');   
        }) 
    });
});
</script>
</head>
<body>
  <div>
    <input type="text" value="John Doe" /> <a href="#"
      class="clearButton">clear</a>
  </div>
  <div>
    <input type="text" value="Jane Doe" /> <a href="#"
      class="clearButton">clear</a>
  </div>
  <div>
    <input type="text" value="Joe Smith" /> <a href="#"
      class="clearButton">clear</a>
  </div>
</body>
</html>

The code above is rendered as follows: