jQuery inserting div after last-of-type

JavaScript
1

Hi there,

I have the following code:

It is basically a grid of 7 boxes. What I would like to do is add a div after the last box on the second row to fill the the space on the right. I can’t change the code too much, so would have to do it via jQuery.

However, I have tried this and it doesn’t seem to be working.
jQuery(".hp-latest-shops .grid-item:last-of-type").insertAfter("<div class='col-lg-3 col-md-4 col-sm-6 col-xs-12 grid-item'>new box</div>")

This seems to remove the 7th box instead of adding it after the 7th box

Am I doing something wrong, or is there a better way to achieve this?

Thanks!

2

I would use the append function.

3

Thanks, I have tried the append, but it seems to be adding under the 7th box and not to the right of it

4

You have your command backward.

$("thing to insert").insertAfter("where to insert it");

2 Likes