getElementByID funciona, getElementsByClassName não [duplicado]

Esta pergunta já tem uma resposta aqui:

O que os métodos querySelectorAll e getElementsBy * retornam? 9 respostas

Estou trabalhando em uma solução que adiciona dinamicamente caixas de entrada / lista suspensa a uma página. O código de exemplo abaixo funciona se eu fornecer a cada entrada selecionada um ID exclusivo e incluir uma linha de cod4e no script usando getElementById (), mas não funcionará se eu usar GetElementsByClassName ().

Meu objetivo é usar um script para preencher a caixa de entrada selecionada sem a necessidade de atribuir um ID exclusivo para selecionar entradas e o código correspondente ao script.

    <select class="p1"></select>
    <select class="p1"></select>
    <select class="p1"></select>

    <script>
    var Date1 = "<option>" + new Date(new Date().getTime()+(1*24*60*60*1000)).toDateString() + "</option>";
    var Date2 = "<option>" + new Date(new Date().getTime()+(2*24*60*60*1000)).toDateString() + "</option>";
    var Date3 = "<option>" + new Date(new Date().getTime()+(3*24*60*60*1000)).toDateString() + "</option>";
    var Date4 = "<option>" + new Date(new Date().getTime()+(4*24*60*60*1000)).toDateString() + "</option>";
    var Date5 = "<option>" + new Date(new Date().getTime()+(5*24*60*60*1000)).toDateString() + "</option>";
    var Date = Date1 + Date2 + Date3 + Date4 + Date5

    document.getElementsByClassName("p1").innerHTML = Date;
    </script>

questionAnswers(1)

yourAnswerToTheQuestion