Как запустить один и тот же скрипт несколько раз на одной странице? ⇐ Jquery

[Гость]

Я создал HTML, CSS и JQuery для отображения графика на основе значений в элементе div с именем класса «out». Мне нужно разместить на странице несколько графиков. У меня проблема в том, что когда я пытаюсь разместить на странице несколько графиков, отображается только первый. Есть ли способ вызвать одну и ту же функцию JQuery несколько раз на одной и той же странице и заставить ее работать правильно?

Мой код ниже:

$(document).ready(function() { $(".out div").each(function() { вар число = $(this).html() вар iNum = parseInt (число); вар eq = $(this).index(); вар FinalSum = (iNum / 20); $(".graph-div").eq(eq).find("div.graph-bar").css("height", FinalSum + "px"); }); }); .graph-box {border:1px Solid #ccc; ширина: подходящее содержимое;} .graph-bar {ширина: 120 пикселей; выровнять-элементы: по центру; размер коробки: border-box;} .graph {display:flex; выравнивание текста: по центру; ширина: 90 пикселей; выровнять-элементы: по центру; размер коробки: border-box;} .graph-div {ширина: 120 пикселей; выровнять-самостоятельно: гибкий конец;} .out {display:flex; выравнивание текста: по центру;} .party {display:flex; граница: 1 пиксель сплошной #ccc; выравнивание текста: по центру; ширина: fit-content;} .out div, .party div {ширина:120 пикселей;} .out div:nth-child(нечетный), .party div:nth-child(нечетный) {background-color:#F0F0F0;} .out div:nth-child(even), .party div:nth-child(even) {background-color:#F9f9f9;} .con {цвет фона: синий;} .lab {цвет фона: красный;} .gre {цвет фона: зеленый;} .lib {цвет фона: оранжевый; 1200 7000 160 6899 Консервативный труд Зеленый Либералы
Демократы 1200 7000 160 6899 Консервативный труд Зеленый Либералы
Демократы