Как при появлении элемента с классом отследить этот класс и изменить свойства другого блока (класса)?

Question

[rmkk]

Ситуация такая:
при нажатии на кнопку "отправить" появляетя новый элемент на странице с классом .first. Я хочу при этом событии (когда появился элемент) убирать соседний div, который имеет класс .second (с помощью задачи ему display:none). Можете подсказать скрипт для решения?

Пока разобрался, как убирать при клике https://jsfiddle.net/rmkk/3v6rm99h/2/ но хочу, именно перехватывать элемент без клика по чему-либо

Comments

[pashted]

если вам помогли, пожалуйста, отмечайте ответы кнопкой "отметить решением"

Answer 1

[Дмитрий Беляев]

.first ~ .second {
  display: none;
}

Comments

[rmkk]

Извините, я не понял. Т.е. совсем не использовать js? просто ~ первый раз вижу

[Дмитрий Беляев]

rmkk: да, то что можно решить стилями, должно решаться стилями
~ селектор сестринства, то есть .first ~ .second означает правило для .second который находится в том же родителе, что и .first

[Givandos]

Да, только есть уточнение: .second стоит только после .first
По сути это не просто сестринство, а младшесесринство :)

Answer 2

[Givandos]

https://developer.mozilla.org/ru/docs/Web/API/Muta...
вот то что нужно.
Вешаете на body и ловите появление/изменение кого вам потребуется.
Примерно так и работает Ангулар и схожие с ним.

Answer 3

[iBird Rose]

а что мешает убрать .second при нажатии на эту кнопку "отправить"?