Как текст из input присвоить определенному блоку с помощью JavaScript?

Не могу понять как добиться такого результата, что бы я вводил в поле какое то текстовое сообщение, а оно отзеркаливалось бы в другой блок, уже долго сижу на этом, буду очень благодарен если кто то подскажет или покажет как такое можно сделать.

Через id взять инпут и дальше при изменении каждый раз передавать в переменную значение этого инпута, а затем вставлять в блок результат с помощью метода JQuery text(), ну и я сделал вывод на консоль что бы было более понятно и наглядно всё видно, вот пример:

.result {
background-color: gray;
width: 100px;
height: 100px;
border: 1px solid black;
}

Сверху стили что бы можно было отличить зону куда должен дублироватся текст из инпута.

<input id="say" type="text"/>

<div
class="result">

Просто html код, первое это инпут а второе это то куда он будет дублироватся, затем ниже js код где вся реализация описанная в начале:

var col1 = ["example"]
var col2 = ["example"]
var col3 = ["example"]
var col4 = ["example"]

let inputTag = document.getElementById("say");
col4 ="";
inputTag.addEventListener("change", (e) => {
col4 = e.target.value
;
$(".result").text(col4);
console.log(col4);
})