Как сделать индикатор выполнения поля ввода полной ширины как в 100% родительского div?

Question

Мой друг помог мне с этим индикатором прогресса. Он работает абсолютно нормально, за исключением того, что индикатор выполнения не является полной шириной родительского элемента div. Новая ширина после каждого ввода добавляется через JS в px. Я новичок в javascript, так что мне нужна помощь.

Вот скрипка - https://jsfiddle.net/greysniper/fnkpu5gc/

Я пытался преобразовать его в процент, но пока безуспешно. Начальная ширина равна 11px, тогда как новая ширина после заполнения каждого входного тега также указывается в пикселях.

<div>
  <span class='meter' style="display:inline-block;background:yellow;color:green;width:0;height:20px"></span>
  <span class='perc'>0</span>%
</div>
<input class="track">
<input class="track">
<input class="track">
<input class="track">
<input class="track">
<input class="track">
<input class="track">
<input class="track">
<input class="dont-track" style="background-color: blue;">
<input class="track">
<input class="track">
<input class="track">
<input class="track">
<input class="dont-track" style="background-color: blue;">
<input class="track">
<input class="track">
<input class="track">
<input class="track">
<input class="track">
<input class="dont-track" style="background-color: blue;">
<input class="track">
<input class="track">
<select class="track">
  <option value="">Choose One</option>
  <option value="1">One</option>
  <option value="2">Two</option>
</select>

$('.track').change(function(e) {
  update_progress();
});

function update_progress() {
  var count = $('.track').length;
  var length = $('.track').filter(function() {
    return this.value;
  }).length;
  var done = Math.floor(length * (100 / count));
  $('.perc').text(done);
  $('.meter').width(done);
}

Answer 1

 $('.meter').width(done);

должно быть

 $('.meter').width(done+"%");

Answer 2

Измените последнюю строку в вашей функции update_progress на:

$('.meter').width(done + '%');

Answer 3

Это потому, что вы используете пиксели вместо процентов. Вместо 25%, вы устанавливаете ширину 25px