Show answer choices again with selection remaining in Qualtrics using Javascript

I have a multiple choice question, where the respondent can choose between two images, which are next to each other. On the next page the answer choices should show in the exact same way, preferably with the selected radio button (where they can not change it anymore) as I want the respondents to ask further questions about their choice. The multiple choice question, and the next page with the answer choices and further questions are in the same block.

I already tried to pipe it from the previous question, but this way the answer choices (images) are comma seperated and below each other.

Thus I want to store the respondents’ responses in an embedded data variable and then display the same answer choices with their responses remaining selected again.

I tried to do it with Javascript but I could not figure it out as I am new to it:

  • First I created an embedded data variable at the very top of the survey flow called “choice”.

  • Then I added this code to the question (Q1):

     Qualtrics.SurveyEngine.addOnPageSubmit(function(){
    
     var answer = this.questionContainer.querySelector(".q-checked")
    
     Qualtrics.SurveyEngine.setEmbeddedData("choice", answer);
     });
    
  • and then I just inserted the embedded data “choice” as piped text in Q2, but it shows nothing in the survey, it is just a blank space.

Note: I am using the ‘simple’ layout.