title: Check if all required fields are filled in a specific div
body: <p>I have some form fields that are dynamically generated form the database. There are inputs, checkboxes, radio buttons, textarea's, and select's. All the fields are in a parent div with ID <code>dynamic-form-fields</code>. Some fields have a <code>required</code> attribute.</p>
  
  <p>This is a multi-step form so each "step/page" needs to be validated before going on to the next step. So it's not submitting the form.</p>
  
  <p>How can I check if all the required fields in div <code>dynamic-form-fields</code> are filled?</p>
  
  <p>Here's something what my HTML code looks like:</p>
  
  <pre><code>&lt;input type="text" name="dff[]" placeholder="Name" required&gt;
  &lt;input type="text" name="dff[]" placeholder="Date of Birth"&gt;
  &lt;input type="text" name="dff[]" placeholder="Email" required&gt;
  &lt;input type="radio" name="gender" value="Male" required&gt;
  &lt;input type="radio" name="gender" value="Female" required&gt;
  &lt;select name="pet"&gt;
      &lt;option value="dog"&gt;Dog&lt;/option&gt;
      &lt;option value="cat"&gt;Cat&lt;/option&gt;
      &lt;option value="bird"&gt;Bird&lt;/option&gt;
  &lt;/select&gt;
  
  &lt;button id="check"&gt;Check&lt;/button&gt;
  
  &lt;script&gt;
      document.getElementById("check").onclick = function () {
          if() {
              alert('error please fill all fields!');
          }
      };
  &lt;/script&gt;
  </code></pre>
  
  <p>As you see, some fields are required and some are not. It is different every time so the solution has to be dynamic. There are also different types of input's such as select, radio, checkbox, text, etc... How can I make sure every "<strong>required</strong>" field inside the div ID <code>dynamic-form-fields</code> is filled?</p>
  
  <hr>
  
  <p><strong>What i've tried:</strong></p>
  
  <p>Maybe something like this but how do I get every type of input (text, radio, checkbox, select, etc...) under the div ID <code>dynamic-form-fields</code>?</p>
  
  <pre><code>$('#dynamic-form-fields input:required').each(function() {
    if ($(this).val() === '')
        alert('error please fill all fields!');
  });
  </code></pre>