How to add styles for SPAN through JS?

Question

css

Hello, I specifically need help here, the implementation does not come to mind.

Fiddle: jsfiddle.net/webirus/yfjqp49q

<span class="span20">Размер шрифта 20 пикселей</span><br>
<span class="span26">Размер шрифта 26 пикселей</span><br>
<span class="span40">Размер шрифта 40 пикселей</span><br>
<span class="span14">Размер шрифта 14 пикселей</span>

.span14 {font-size: 14px;}
.span20 {font-size: 20px;}
.span21 {font-size: 21px;}
.span22 {font-size: 22px;}
.span23 {font-size: 23px;}
.span24 {font-size: 24px;}
.span25 {font-size: 25px;}
.span26 {font-size: 26px;}
.span40 {font-size: 40px;}

Now I have it implemented like this, but there are a lot of different sizes, more than the 2 that I indicated.
Is it possible through JS or better jQuery to make a small script that would look at the number in the name of the span-size- 20 class and automatically write the same value of 20px in css, even inline.

I want to avoid the extra 50 lines of css that I have to write now, in case other sizes are added.

The class names are not critical, you can add a common class, all these styles are in a separate div from the page.

The spans go one by one and contain different text screen.webirus.ru/2015-10-06_224457.png
And the whole thing is corrected through html. I do not want to prescribe all possible font sizes from 10 pixels to 50 pixels, creating classes. And in this block with promotions, the fonts are different almost on every line.

Answer 1

$('span').each(function(){
  var font_size = $(this).attr('class');
  font_size = font_size.replace(/\D/g, '') + 'px';
  $(this).css('font-size', font_size);
})

Answer 2

$('.span').attr("style","font-size: 20px;) or simply by adding and removing the class .addClass .removeClass