Как сделать панель навигации для демонстрации разного веса гарнитуры?

Question

Поэтому я пытаюсь сделать горизонтальную интерактивную панель, чтобы показать разные веса моего шрифта. У меня есть 14 строк, показывающих это, но я не знаю, как сделать это до 1 строки, а просто переключаюсь между разными весами. Снимок экрана с конечным продуктом.

Answer 1

Я сделал чистый JS код для клонирования ваших текстовых элементов и увеличения веса шрифта.
Вы можете увидеть это здесь => https://codepen.io/baessodiego/pen/YzXbqev

Или здесь

var j = 100

for(i=0; i<9; i++){
var p = document.createElement("P");  // Create a <> element
var t = document.createTextNode("Your font here, " + j);  // Create a text
p.id = "font"; // add id to P
p.appendChild(t); // add Text to P
p.style.fontWeight = j; // add Style to P

j += 100 // Increase weight

document.body.appendChild(p);  // append element to other elements
}