jquery - Target div class within by div id -

this div structure

<div id="parnet1">    <div id="subparnet1">      <img src="smiley.png" class="faces">    </div> </div> <div id="parnet2">    <div id="subparnet2">      <img src="sadf.png" class="faces">    </div> </div> <div id="parnet3">    <div id="subparnet3">      <img src="grumpy.png" class="faces">    </div> </div> 

i want make grumpy.png invisible using jquery. below tried. doesn't work.

$('#subparnet3').find('.faces').css('display', 'none'); 

works jquery:

$('#subparnet3').find('.faces').css('display', 'none');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div id="parnet1">    <div id="subparnet1">      <img src="smiley.png" class="faces">    </div>  </div>  <div id="parnet2">    <div id="subparnet2">      <img src="sadf.png" class="faces">    </div>  </div>  <div id="parnet3">    <div id="subparnet3">      <img src="grumpy.png" class="faces">    </div>  </div>

you can use .hide():

$('#subparnet3').find('.faces').hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div id="parnet1">    <div id="subparnet1">      <img src="smiley.png" class="faces">    </div>  </div>  <div id="parnet2">    <div id="subparnet2">      <img src="sadf.png" class="faces">    </div>  </div>  <div id="parnet3">    <div id="subparnet3">      <img src="grumpy.png" class="faces">    </div>  </div>

see grumpy.png hidden. check if css has !important in them or if have forgot include jquery.