Нумерованный список изменяется, чтобы отражать видимые элементы

Question

У меня есть список элементов, которые мне нужно пронумеровать. Как только пользователь нажимает кнопку, один из нумерованных элементов списка не отображает. Затем мне нужно, чтобы нумерованный список изменился, чтобы отразить новый порядок.

Я могу вернуть количество элементов списка и что это может быть способ изменения номеров в списке.

var btn = $('.btn'); 
var hide = $('.hide'); 
var shm = $('.showHowMany'); 

$(btn).click(function(){ 
    $(hide).css({"display": "none"}); 
    $(function() { 
    var howMany=$('p:visible').length; 
     if(howMany === 2){$(shm).html('There are ' + howMany); } 
    }); 
}); 

Может ли кто-нибудь указать мне, как это может быть достигнуто.

Jfiddle of what I have so far

Answer 1

После удаления p, вы можете использовать функцию text() в цикле над каждым из остальных элементов. Затем вы можете разбить текст пробелами, удалить первый элемент, добавить индекс этого элемента и снова объединить его. Попробуйте это:

$('.wrapper p:visible').text(function(i, v) { 
    var words = v.split(' '); 
    words.shift(); 
    return (i + 1) + ' ' + words.join(' '); 
}); 

Example fiddle

Также обратите внимание, что я убирала свой код немного, как вы были дважды обернув свои объекты JQuery.