Question

Every time I load a page, I have a random number of elements with the same class and different(random) IDs.

I would like to know how I can keep only one element on the page and delete the others from DOM, according to their class?

Example:

<div id="joke" class="hey"></div>
<div id="joking" class="hey"></div>
<div id="jokes" class="hey"></div>
<div id="joker" class="hey"></div>

I would like to leave only id="joke" where joke (as for the other element’s id values) is randomly/dynamically generated.

Answer 1

If you only want to keep the first one:

$('.hey').slice(1).remove();

Reference: .slice(), .remove()