Semantic UI not validating dynamically generated dropdown

Question

I have a dynamically added Semantic UI dropdown with the name "language2" and the validation rule:

language2: {
  identifier: 'language2',
  rules: [
    {
      type: 'empty',
      prompt: 'Please select a language',
    }
  ]
},

Here I call the function that dynamically adds the dropdown: document.getElementById('addDivButton').addEventListener('click', addDiv);

The dropdown is initialised inside the addDiv function. However, the menu is not being validated. All other hardcoded elements in the form validate fine. Only this dynamically generated one.

Any help is appreciated.

Answer 1

I have figured out what to do. You need to include a copy of the rule inside the function addDiv in order to validate dynamic elements.