Стиль Javascript Текстэлемент в самом CSS или Javascript

Question

Я поместил текстовый элемент Javascript в поле HTML div и теперь хочу, чтобы цвет текста был белым. Я также хочу внести в текст еще несколько изменений. Теперь мне интересно, как я могу стилизовать текстовый элемент или возможно ли это в этой форме.

(в переводе на Google Translate, может содержать ошибки)

Это мой javascript код:

var bghtooltipin = document.getElementById('bgh-tooltipin1');
var bghtooltipout = document.getElementById('bgh-tooltipout1');
bghtooltipin.addEventListener('mouseover', bghtooltipinmouseOver);
bghtooltipin.addEventListener('mouseout', bghtooltipoutmouseOut);

function bghtooltipinmouseOver() {
  bghtooltipout.innerHTML = 'Go to Login';
}

function bghtooltipoutmouseOut() {
  bghtooltipout.innerHTML = ' ';
}

Answer 1

есть 2 способа: либо использовать css классы, либо прямую style манипуляцию

var bghtooltipin = document.getElementById('bgh-tooltipin1');
var bghtooltipout = document.getElementById('bgh-tooltipout1');
bghtooltipin.addEventListener('mouseover', bghtooltipinmouseOver);
bghtooltipin.addEventListener('mouseout', bghtooltipoutmouseOut);

function bghtooltipinmouseOver() {
  bghtooltipout.innerHTML = 'Go to Login';
  bghtooltipin.style.color = "white";
}

function bghtooltipoutmouseOut() {
  bghtooltipout.innerHTML = ' ';
  bghtooltipin.style.color = "black";
}

<div id="bgh-tooltipin1">Test 1</div>
<div id="bgh-tooltipout1"></div>

Answer 2

Спасибо @ Józef Podlecki, теперь я хотел бы добавить небольшой переход к моему тексту, чтобы текст при наведении курсора был примерно через 6 миллисекунд. Это будет мое второе изменение текста.

Потому что я не справился с этим с элементом стиля classi c.

Answer 3

Похоже, вы хотите изменить цвет текста, когда пользователь наводит курсор на кнопку. CSS имеет класс псевдокласса, который охватывает этот вариант использования. Взгляните на https://developer.mozilla.org/en-US/docs/Web/CSS/: hover