Метод setAttribute не работает все время

Question

У меня есть код, который при наведении курсора отображает некоторый текст в div в верхней части страницы в зависимости от выбранного параметра.

При изменении параметра текст, отображаемый при наведении, иногда работает.

Я извлекаю информацию из SVG, и это информация, которую я изменяю.

Это одно из значений из SVG:

<path id="HI" data-info="<div>State: Hawaii</div><div>Capital: 
  Honolulu</div>"

Я изменяю это следующим образом:

document.getElementById('HI').setAttribute('data-info','State: Alabama  
 </br> Owner: xyz ');

И этот метод вызывается внутри .change (function ()), поэтому, когда я изменяю Option, он обновляет информацию.

И это моя функция наведения

 $("path, circle").hover(function(e) {
 $('#info-box').css('display','inline');
 $('#info-box').html($(this).data('info'));
  });

Опять же, это иногда срабатывает, поэтому я не совсем уверен, почему информация не обновляется постоянно.

Надеюсь, вы, ребята, можетепомощь.

Answer 1

Если вы используете jQuery и используете функцию data , то почему бы не использовать ее для установки значения и чтения?

$(this).data('info', 'State: Alabama </br> Owner: xyz');