const ButtonGroup = document.getElementsByClassName('amber-button-group')[0];
ButtonGroup.insertAdjacentHTML('beforeend', '<button onclick="text(this.value)" value="1" style="background:#00945e;padding: 10px;width: fit-content;color: #fff;border-radius: 14px;"><b>Приветствие</b></button>');
ButtonGroup.insertAdjacentHTML('beforeend', '<button onclick="text(this.value)" value="2" style="background:#00945e;padding: 10px;width: fit-content;color: #fff;border-radius: 14px;"><b>Как дела?</b></button>');
ButtonGroup.insertAdjacentHTML('beforeend', '<button onclick="text(this.value)" value="3" style="background:#00945e;padding: 10px;width: fit-content;color: #fff;border-radius: 14px;"><b>Ты чего?</b></button>');
ButtonGroup.insertAdjacentHTML('beforeend', '<button onclick="text(this.value)" value="4" style="background:#00945e;padding: 10px;width: fit-content;color: #fff;border-radius: 14px;"><b>Да, все норм</b></button>');
ButtonGroup.insertAdjacentHTML('beforeend', '<button onclick="text(this.value)" value="5" style="background:#00945e;padding: 10px;width: fit-content;color: #fff;border-radius: 14px;"><b>Пока</b></button>');
const myinputfield = document.querySelector("#myinputfield");
function text(a) {
switch (a) {
case "1":
myinputfield.value = myinputfield.value + "Привет";
break;
case "2":
myinputfield.value = myinputfield.value + "Как дела?";
break;
case "3":
myinputfield.value = myinputfield.value + "Ты чего?";
break;
case "4":
myinputfield.value = myinputfield.value + "Да, все норм";
break;
case "5":
myinputfield.value = myinputfield.value + "Пока";
break;
}
}
Сам поймёшь, лень объяснять то чего добавил