create an array of options in innertext tag and select an option in javascript

I have an issue with chess code in javascript, i want two things pls first:

1- I need to create a list whenever a pawn reaches the other opponent last line to be able to display a list of(Queen, Knight, Bishop or Rook) and choose from those options I have named them accordingly for black starts with B like Bqueen,Bknight,Bbishop and Brook same for white starting with W here the code snippet

`document.querySelectorAll(‘.box’).forEach(item => {

item.addEventListener('click', function () {


    if (item.style.backgroundColor == 'pink') {

        pinkId = item.id
        pinkText = item.innerText

        document.querySelectorAll('.box').forEach(item2 => {

            item2.addEventListener('click', function () {

                getId = item2.id
                arr = Array.from(getId)
                arr.shift()
                aside = eval(arr.pop())
                arr.push('0')
                aup = eval(arr.join(''))
                a = aside + aup

                if (item2.style.backgroundColor == 'green' && item2.innerText.length == 0) {

                    if (pinkText == `Wpawn` && aup == 800) {
                        
                        document.getElementById(`b${a}`).innerText ='Wknight'
                        document.getElementById(`b${a}`).innerText =''
                        document.getElementById(pinkId).innerText = ''
                        coloring()
                        insertImage()

                    }
                       else if (pinkText == `Bpawn` && aup == 100) {

                        document.getElementById(`b${a}`).innerText = 'Bqueen'
                        document.getElementById(pinkId).innerText = ''
                        coloring()
                        insertImage()

                    }`

in document.getElementById(b${a}).innerText i need to display a list with Wqueen,Wknight,Wbishop,Wrook
and select a piece from it.

2-I need help to make a checkmate code to prevent the king from move if checkmate is reach not just take the king in a move here a snippet of the code.

`numOfKings = 0

    document.querySelectorAll('.box').forEach(win => {
        if (win.innerText == 'Wking' || win.innerText == 'Bking') {
            numOfKings += 1
        }

    })

    if (numOfKings == 1) {
        setTimeout(() => {
            // console.log(`${toggle}`) 
            if (tog % 2 == 0) {
                alert('White Wins !!')
                location.reload()
            }
            else if (tog % 2 !== 0) {
                alert('Black Wins !!')
                location.reload()
            }
        }, 100)
    }



})

})`

Thank you so much guys all the best.

I’m stuck and need help pls