CODEWITHSUNDEEP
jqueryappend
Michelle
Michelle

Reputation: 1844

Removing last image via jQuery

I would like to add an image at the end of each "booklist" within the "genre" div, but remove it for the last "booklist" within each genre. The following code is it adding just fine, but I'm messing something up when it comes to the removal. It's only removing the last image from the last .booklist on the page.

This is my HTML:

<div class="genre">

    <div class="booklist">
    <!-- stuff -->
    </div><!-- .booklist -->

    <div class="booklist">
    <!-- stuff -->
    </div><!-- .booklist -->

</div><!-- .genre -->

<div class="genre">

    <div class="booklist">
    <!-- stuff -->
    </div><!-- .booklist -->

    <div class="booklist">
    <!-- stuff -->
    </div><!-- .booklist -->

 </div><!-- .genre -->

And this is my jQuery:

// ADD HEART DIVIDER BETWEEN SERIES ON BOOK PAGE
$(".genre .booklist").append("<img class='hr' src='"+my_home_object.my_stylesheet_path+"/images/heart-hr.png' />");
$(".genre .booklist:last img:last").remove();

Thank you for your help!

Upvotes: 0

Views: 1890

Answers (1)

Digital Plane
Digital Plane

Reputation: 38294

Try this to remove the last imgs in the last divs with class "booklist" in each "genre":

$(".genre .booklist:last-child > img:last-child").remove();

:last only selects one element, so use :last-child.

Upvotes: 3

Related Questions