javascript - html get div tag in many levels -

i got class required on div tag, , want remove change function of text field, can't div level, please me reach this.parent.parent.closest('div')

<div class='required'>     <div>         <div>             <input type='text' value='123' onchange(removerequired(this, this.parent.parent.closest('div')))/>         </div>     </div> </div> <script type='text/javascript'>     function removerequired(elm1, elm2){         if ($(elm1).val()) {             $(elm2).removeclass('required');         }     } </script> 

it seems want add/remove required class based on whether input empty or not.

$('.required').on('change', 'input', function(event) {    // add or remove required class    $(event.delegatetarget)        .toggleclass('required', this.value.length === 0); }); 

it work following html:

<div class='required'>     <div>         <div>             <input type='text' value='123'/>         </div>     </div> </div> 

it sets event delegation on outermost <div> elements , sets or removes required class based on input value.

demo