I'm not really sure how to go with this, but here goes:

I have form elements that trigger a function (mainly for validation purposes). This triggers on click, on change etc. These are written with vanilla JavaScript.

If it's a straight-forward HTML element then everything works fine. E.g. a <select> element fires on change.

However, if I use a jQuery script (e.g. a jQuery colour selector), then although that jQuery script populates an <input> field, the validation script doesn't fire.

This I suppose is obvious as you don't click, blur, change it, it's just the jQuery script changing it.

Of course I could change the JavaScript in the colour selector jQuery script so it also fires the validation script, but there must be a better way where as well as on click, on change, on blue etc. I can also activate the function when it picks up that another script is changing it. I need this for various occasions and scripts.

Another example is a rating script (rate out of 5). It uses radio buttons as a non-jQuery fallback and the jQuery script just hides those radios (with CSS), displays the star images and then changes the radios when the user interacts with the star images. That way the server handles a form submit the same way regardless of the availability of jQuery. However, the validation script doesn't fire.

Any ideas?