Select radio based on dropdown

Hi Max/Bob,
​
I'm migrating my forms from CFv5 to CFv6 manually.
CFv6 works much nicer than CFv5, my compliments! Unfortnately I came across one issue.
​
In CFv5 I used a dropdown box en when a certain value was selected (Shanti horde), in the radiobox below the value "meisje"(equals true) was automatically selected.
​
This was all done by this piece of javascript which was located in the ON LOAD section of the SETUP area by using a javascript action.

jQuery(document).ready(function(jQ){
  jQ('#speltakkeuze').on('change', function(){
    var event;
    event = jQ('#speltakkeuze').val();
    if ( event == 'Shanti horde') {
      jQ('#radio11').attr('checked', true);
      jQ('#fin-radio11 input:radio').attr('readonly', true);
    } else {
       jQ('#radio11').attr('checked', false);
      jQ('#fin-radio11 input:radio').attr('readonly', false);     
    }
  });
});

In CFv6 I assume the javascript needs to be moved to the designer area. But still when I do this it isn't working.
How should I do this in CFv6?

Hi TjerkH ,
​
Have you updated the element ids e.g. #radio11 to match the CFV6 ids?
​
Bob

empty

Hi Bob,
​
I gave it a try, although I'm not an expert in this. Unfortunately it doesn't work and I don't have a clue. Would really appreciate some help.
Or any other way to achieve the same thing (select an option in a radio group based on a selection of a dropdown)
​

jQuery(document).ready(function(jQ){
  jQ('data:speltakkeuze').on('change', function(){
    var event;
    event = jQ('data:speltakkeuze').val();
    if ( event == 'Shanti horde') {
      jQ('data:radio11').attr('checked', true);
      jQ('data:fin-radio11 input:radio').attr('readonly', true);
    } else {
       jQ('data:radio11').attr('checked', false);
      jQ('data:fin-radio11 input:radio').attr('readonly', false);     
    }
  });
});