Create text by checking radios-CodePudding

I want to create some text in a contentediable by checking radios (without pressing a button at the end). I've created this but don't understand why it doesn't work :/

I guess there is a problem with the function's argument but I can't figure out why.

Thanks if you help me :)

function genereItem(x){
    document.getElementById("item" x).innerHTML = document.querySelector("input[name=" x "]:checked").value;
}

.editable{
 border: solid black 1px;
}

<div>
  <div>itemA1
    <input id="yesA1" name="A1" type="radio" value="item A1 = yes," onchange="genereItem("A1")"/>
    <label for="yesA1">yes</label>
    <input id="noA1" name="A1" type="radio" value="item A1 = no," onchange="genereItem("A1")"/>
    <label for="noA1">no</label>
    <input id="NTA1" name="A1" type="radio" value="item A1 = NT," checked="checked" onchange="genereItem("A1")"/>
    <label for="NTA1">NT</label>
  </div>
  <div>itemA2
    <input id="yesA2" name="A2" type="radio" value="item A2 = yes." onchange="genereItem("A2")"/>
    <label for="yesA2">yes</label>
    <input id="noA2" name="A2" type="radio" value="item A2 = no." onchange="genereItem("A2")"/>
    <label for="noA2">no</label>
    <input id="NTA2" name="A2" type="radio" value="item A2 = NT." checked="checked" onchange="genereItem("A2")"/>
    <label for="NTA2">NT</label>
  </div>
  <div>itemB1
    <input id="yesB1" name="B1" type="radio" value="item B1 = yes," onchange="genereItem("B1")"/>
    <label for="yesB1">yes</label>
    <input id="noB1" name="B1" type="radio" value="item B1 = no," onchange="genereItem("B1")"/>
    <label for="noB1">no</label>
    <input id="NTB1" name="B1" type="radio" value="item B1 = NT," checked="checked" onchange="genereItem("B1")"/>
    <label for="NTB1">NT</label>
  </div>
  <div>itemB2
    <input id="yesB2" name="B2" type="radio" value="item B2 = yes." onchange="genereItem(B2)"/>
    <label for="yesB2">yes</label>
    <input id="noB2" name="B2" type="radio" value="item B2 = no." onchange="genereItem(B2)"/>
    <label for="noB2">no</label>
    <input id="NTB2" name="B2" type="radio" value="item B2 = NT." checked="checked" onchange="genereItem("B2")"/>
    <label for="NTB2">NT</label>
  </div>
  <div  contenteditable="true">
    <div>
      <string id="itemA1"></string>
      <string id="itemA2"></string>
      <p/>
    </div>
    <div>
      <string id="itemB1"></string>
      <string id="itemB2"></string>
      <p/>
    </div>
  </div>
 </div>

CodePudding user response：

genereItem(A1)

Uncaught ReferenceError: A1 is not defined

Use genereItem("A1") (a string, not a variable name)