How to delete a class from another element after input or textarea has been filled?

Those. there is:

<input class="data" type="text" value="" placeholder="Тест 1"> <input class="data" type="text" value="" placeholder="Тест 2"> <input class="data" type="text" value="" placeholder="Тест 3">

AND:

 <a href="#test" class="test no_valide">Тест</a>

After all the input have been filled in, the reference must remove the no_valide class.

    3 answers 3

    In pure javascript -

     const inputAll = Array.from(document.body.querySelectorAll('.required-field')); const link = document.body.querySelector('.some-link'); inputAll.forEach(item => item.addEventListener('input', requiredField_inputHandler)); function requiredField_inputHandler(){ if( isInputIsNotEmptyAllValid(inputAll) ){ link.classList.remove('not-validate'); }else{ link.classList.add('not-validate'); } } function isInputIsNotEmptyAllValid( inputAll ){ let length = inputAll.length; while(length--){ let input = inputAll[length]; if( ! input.value ){ return false; } } return true; } 
     .not-validate { color: red; } 
     <input type="text" class="required-field"> <input type="text" class="required-field"> <input type="text" class="required-field"> <a href="#" class="some-link not-validate">some link</a>

      JSFiddle - https://jsfiddle.net/9uuhve7g/

      Add an id to each field so that you can determine when exactly everything is filled.

       $( ".data" ).change(function() { if ($('#1').val() != '' && $('#2').val() != '' && $('#3').val() != '') { $(".test").removeClass('no_valide'); } });

        Searches in all inputs, if not an empty field, then remove the class from id test

         $(":input").each(function() { if($(this).val() != "") ('#test').removeClass('no_valide'); });