Question

How would I incorporate $('#featured article').last().empty(); into a basic JS/jQuery loop so that the loop continues until the number of instances of #featured article has reduced to a finite number of instances, four for example?

I’m thinking do while would be the most appropriate, however as the number of instances is reducing rather than increasing I don’t appear to be able to work it out.

Answer 1

#featured_article is an ID, and the DOM only allows one element for each ID. Change it to a class (i.e. $('.featured_article')) and jQuery will loop it for you. You can use .remove() instead of .empty() to actually remove the element from the DOM tree, which is, I think, what you are looking to do:

$('.featured_article').last().remove();

As far as a while loop, try this:

while ($('.featured_article').size() > 4)
{
  $('.featured_article').last().remove();
}