html - jquery show/hide all children of given element -


in html:

    $('#endre_dinmeny').click(function() {          $('.form-validate').children('.label-visible').hide();          $('.form-validate').children('.edit-visible').show();      });
<span id="endre_dinmeny" class="col-md-6 bestill-edit2">endre</span>  <div class="form-validate">    <div class="row">      <label class="col-md-4">        leveringsfrekvens      </label>      <div class="label-visible">        view      </div>      <div class="edit-visible">        edit      </div>    </div>  </div>       

what doing wrong doesn't absolutetly nothing? i've been 48h straigh please, gentle if spot noob error, i'm tired of banging head this..

best regards,

use find()

 $('.form-validate').find('.label-visible').hide();  $('.form-validate').find('.edit-visible').show(); 

find('.label-visible') not work because .label-visible not direct child.

children() search direct descendants. find search direct and nested descendants.

finally, if have multiple .form-validate elements, should narrow context using $(this)

$(this).find('.form-validate .label-visible').hide(); $(this).find('.form-validate .edit-visible').show(); 

Comments