Estoy tratando de cambiar el color de fondo de los elementos html dinámicos, pero la consola muestra 'Error de tipo no detectado: no se pueden establecer propiedades de indefinido'.

Aquí está mi código JS completo:

 function showQuestion(){ for(let i = 0; i < QuesPartA.length; i++){ $(".questionBox").append('<div class="Question">Number '+ parseInt(i+1) +'</div>'); QuesPartA[i]['option'].forEach(option => { $(".questionBox").append('<span class="pilihan">'+option +' </span><br>'); }); } $(".secondBox").append('<a href="Listening Part A.html" class="btnToPartB">Continue to Part B</a>'); }; $(".questionBox").on("click", "span.pilihan", function() { const choice = document.getElementsByClassName(".pilihan") choice.style.backgroundColor = "red"; });

Quiero cambiar el color de fondo de .pilihan para que sea rojo cuando el usuario hace clic, pero ese mensaje aparece en la consola. ¿Es esto porque el .pilihan es un elemento dinámico?

Agradezco cada ayuda.