Геннадий

Уберите visibility: hidden из класса modal

.modal {
    display: none;
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background-color: rgb(0, 0, 0, .8);
    z-index: 2;
}

А что, собственно, у вас трудности вызывает?

Как это можно осуществить?

В общем это выглядит так:
1. Проверяете ваше условие. Если оно возвращает true, показываете кнопку.
2. Нажимаете кнопку, показываете сообщение.
3.а. Можете обновлять запись сразу при открытии сообщения.
3.б. Обновляете запись при закрытии сообщения.
4. Условие в п.1. больше не должно проходить проверку.

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

TinyMCE
https://www.codexworld.com/add-wysiwyg-html-editor...

Потому-что, если вы ничего не ввели и преобразовываете к Number, то message вернёт 0, а не null и ваша проверка на null не сработает.
message = Number(message); // здесь ноль
И при выполнении условия из цикла нужно выходить.

let total = 0;

let message;

for (let i = 0; i < 1; total += message) {
  message = prompt('Введите любое число!');

  if (message !== null) {
  	message = Number(message);
  }

  if (message === null) {
    message = alert(`Общая сумма чисел равна ${total}`); 
    break;
  }
}

Как обратиться к нужному div с нужным Id?

Использовать getElementById()
https://developer.mozilla.org/en-US/docs/Web/API/D...

Что мне нужно искать input только в родителе с нужным ID

Потом в div искать через querySelector()
https://developer.mozilla.org/en-US/docs/Web/API/D...

Примеры можно посмотреть тут: https://bobbyhadz.com/blog/javascript-get-child-el...

А что вы хотите увидеть в alert, если функция long у вас ничего не возвращает?

Если нужно выводить при нажатии по ссылке, то вешаете событие на клик по ссылке и в коде выводите содержимое span в ссылке в результат.

let elements = document.getElementsByClassName("menu-link");

	let myFunction = function() {
	    let nodes = this.childNodes;
	    for (let node of nodes) {
	    	if (node.classList.contains("menu-title")) {
	    		let result = document.getElementById("result");
	    		result.innerText = node.innerText;
	    	}
	    }
	};

	for (let i = 0; i < elements.length; i++) {
	    elements[i].addEventListener('click', myFunction, false);
	}

Либо можно через JQuery:

$(".menu-link").click(function() {
		$("#result").text($(this).text());
	});

Как подключить JQuery, я думаю вам объяснять не надо. Даже, если не знаете, это гуглится за 2 минуты.

1. Делаете маршрутизацию.
2. Для каждого элемента (товара) на странице catalog, формируете ссылку /product/{code}, где code - артикул или другой уникальный идентификатор товара.
3. При нажатии на товар происходит переход на /product/{code}, где по code получаете данные для нужного товара и делаете рендеринг шаблона product.html.

Во-первых, вы в else через break outer; прерываете выполнения цикла, и у вас отрабатывает только элемент array[0][0].
Во-вторых, что вы здесь let j in i собрались перебирать?
Надо вот так:

outer: for (let i in array) {
  console.log(array[i])
  for(let j in array[i]) {
    console.log(array[i][j])
    if(city === array[0][j]) {
      alert('Казахстан')
      break outer;
    } else if (city === array[1][j]) {
      alert('Россия')
      break outer;
    } else if (city === array[2][j]) {
      alert('Китай')
      break outer;
    } else if (city === array[3][j]) {
      alert('США')
      break outer;
    } else {
      alert('Такого города не найдено')
    }
  }
}

Да и alert('Такого города не найдено') не обязательно вызывать при каждом проходе. Можно сделать так:

var gotCity = false

outer: for (let i in array) {
  console.log(array[i])
  for(let j in array[i]) {
    console.log(array[i][j])
    if(city === array[0][j]) {
	  gotCity = city
      alert('Казахстан')
      break outer;
    } else if (city === array[1][j]) {
      alert('Россия')
      gotCity = city
      break outer;
    } else if (city === array[2][j]) {
      alert('Китай')
      gotCity = city
      break outer;
    } else if (city === array[3][j]) {
      alert('США')
	  gotCity = city
      break outer;
    }
  }
}

if (gotCity === false) {
	alert('Такого города не найдено');
}