How to get div values?

Question

JavaScript

There are 5 divs with text nodes inside:

<div class="counter">
    <div class="count" data-num=''>1</div>
    <div class="count" data-num=''>2</div>
    <div class="count" data-num=''>3</div>
    <div class="count" data-num=''>4</div>
  </div>

The task is as follows: take all the values, convert to a string-number, arrive at this number another number. And do the opposite, disband the result by div'am.

Basically what I got. But this is very ugly. Help me write better.

https://jsfiddle.net/r733me83/1/

Help how to do it. Or give a direction where to look for a solution.

Answer 1

setInterval(count => {
  const
    len = count.length,
    val = `${+count.map(n => n.textContent).join('') + 1}`.padStart(len, 0).slice(-len);

  count.forEach((n, i) => n.textContent = val[i]);
}, 50, [...document.querySelectorAll('.count')]);

https://jsfiddle.net/vtp4wqfo/

Answer 2

$('.selector').each(function(){
  $(this).text(+$(this).text() + 1);
});

https://jsfiddle.net/knft23sr/1/

Answer 3

https://jsfiddle.net/zrpq125n/5/

Answer 4

So?