我试图向候选人展示'；s数据，但不幸的是使用ajax时出错

我试图显示候选人的数据，但不幸的是，我得到了错误参考错误：候选人未定义请帮助我如何解决此问题，谢谢

Ajax脚本

<script>
$(document).ready(function(){
$('.election').on('change', function(){
var id = $(this).val();
$('#electionPosition').empty();
    axios
    .post('{{route("election.voting.search")}}', {
    _method: 'post',
    _token: '{{csrf_token()}}',
    election_id: id,
    })
    .then(function (response) {
    response.data.election_postion.forEach(element => {
    element.election_candidate.forEach(elements =>{

       let candidates = `<div class="col-lg-6 col-xl-4">
            <div class="card">
                <img class="rounded-circle userImage" src="{{ url('') }}/assets/images/download.png"  alt="Card image cap">
                <div class="card-body">
                    <h5 class="card-title text-center">${elements.candidate.name}</h5>
                </div>
            </div>
        </div>`

    })
    $('#electionPosition').append(`
        <h3 class="heading">${element.position.name}</h3>
        <div class="row">
            ${candidates}
        </div>
    `);
    });

    })
    .catch(function (error) {
    console.log(error);
    });
});
});
</script>

$（文档）.ready（函数（）{
$（'.election'）。在（'change'，function（）上{
var id=$（this.val（）；
$（'#electionPosition'）.empty（）；
axios
.post（{route（“election.voting.search”）}{
_方法：“post”，
_令牌：{{csrf_token（）}}}，
选举编号:id,，
})
.然后（功能（响应）{
response.data.election\u position.forEach（元素=>{
element.election_candidate.forEach（elements=>{
让候选人=`
${elements.candidate.name}
`
})
$（'#electionPosition'）。追加(`
${element.position.name}
${candidates}
`);
});
})
.catch（函数（错误）{
console.log（错误）；
});
});
});

你应该把

$（'#electionPosition'）.append（…}）在
元素.election\u candidate.forEach（…）
循环中编码，因为候选对象是在此循环中定义的，您无法从外部访问它