JSFiddle - React, Tailwind, and code Playground
HTML
<div class="entry">
<div class="entry-head">1 | Name: Grimbode ....</div>
<div class="entry-content">Random message
<form class="test">
<div class="entry-options">
<input type="submit" value="Delete" name="edit" />
<input type="hidden" value="3" name="entryID" />
</div>
</form>
</div>
</div>
<div class="entry">
<div class="entry-head">2 | Name: Grimbode ....</div>
<div class="entry-content">Random message
<form class="test">
<div class="entry-options">
<input type="submit" value="Delete" name="edit" />
<input type="hidden" value="3" name="entryID" />
</div>
</form>
</div>
</div>
<div class="entry">
<div class="entry-head">3 | Name: Grimbode ....</div>
<div class="entry-content">Random message
<form class="test">
<div class="entry-options">
<input type="submit" value="Delete" name="edit" />
<input type="hidden" value="3" name="entryID" />
</div>
</form>
</div>
</div>
JavaScript
$('.test').on('submit', function (e) {
e.preventDefault();
var $this = $(this);
var $this2 = $this.closest('.entry').find('.entry-head');
var $entryID = parseInt($this2.text().split('|')[0].replace(/ /g,''));
alert($entryID);
var $entries = $('.entry-head').not($this2).filter(function(){
return parseInt($(this).text().split('|')[0].replace(/ /g, '')) > $entryID;
}); // Is 0
$entries.each(function (index, value) {
var id = $entryID + index + 1;
$(value).text($(value).text().replace(id, (id-1)));
console.log('Index: ' + index + ' | ' + $entryID);
});
});