Как изменить ширину SVG с помощью JQuery

Question

Я использую Articulate Storyline и хочу изменить ширину линии , которую я создал в программном обеспечении, используя Javascript .

Я ужезнаю, что я могу выбрать любой элемент (каждый элемент экспортируется в SVG в выводе Storyline), используя эту строку кода:

 var item = $('[aria-label="Ourline"] svg')

Тогда мы сможем сделать некоторые анимации jQuery ...

Проблема в том, что я не могу изменить атрибут ширины выбранной строки, используя следующий код:

 $(item).attr("width","500");

Он просто меняет положение строки 500 px направильно!Что?!

Буду признателен за любые предложения.

Обратите внимание: вопрос не имеет отношения к Storyline, это все о SVG и jquery.

Answer 1

https://jsfiddle.net/whLf02n8/

html:

<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>

<button id="7">7</button>
<button id="3">3</button>

javascript:

$('button').click(function() {
    const id = $(this).attr('id');
  $('svg circle').attr('stroke-width', id);
})