jQuery append to a sibling div

Question

I have the following code which moves an element inside another one using jquery but I need to target just the wrapper that is the sibling of the element instead of all the wrappers.

$('.add_to_cart_button').appendTo('.product-box-image-wrapper');

Heres the markup :

<li class="post-2045 product type-product status-publish has-post-thumbnail product_cat-accessories product_cat-designer-boots product_cat-footwear product_cat-shorts product_tag-boots product_tag-deluxe last instock featured shipping-taxable purchasable product-type-simple"> <a href="http://localhost:8888/majestica/product/evening-black-night-skirt/" class="woocommerce-LoopProduct-link woocommerce-loop-product__link"><div class="product-box-image-wrapper"><img width="300" height="375" src="http://localhost:8888/majestica/wp-content/uploads/2018/08/kristina-dam-studio-aw17-collection-9-300x375.jpg" class="attachment-woocommerce_thumbnail size-woocommerce_thumbnail wp-post-image" alt=""></div><h2 class="woocommerce-loop-product__title">Evening Black Night Skirt</h2> <span class="price"><span class="woocommerce-Price-amount amount"><span class="woocommerce-Price-currencySymbol">£</span>550.00</span></span>

Any ideas ?

Thanks.

Please be clear: show the markup you are using, and identify where you want to "target" specifically — random_user_name
– random_user_name, Commented Sep 13, 2018 at 1:06
A minimal representation of the markup without all the unnecessry attributes would sure make this easier to read through. 75% of what you posted requires long horizontal scroll to examine and that's on a desktop — charlietfl
– charlietfl, Commented Sep 13, 2018 at 1:23

2 revs · Accepted Answer · 2018-09-13 01:23:29Z

2

One option is:

$('.add_to_cart_button').each(function() { $(this).prev('a.woocommerce-LoopProduct-link').children('.product-box-image-wrapper').append(this); });

A less efficient option is:

$(this).closest('li').find('.product-box-image-wrapper').append(this);

edited Sep 13, 2018 at 1:23

community wiki

2 revs
undefined

Sign up to request clarification or add additional context in comments.

8 Comments

vol7ron Over a year ago

I'm curious why this was downvoted. Upon initial evaluation based on what the OP asked, it seems like that should work

Ram Over a year ago

@ScottHunter So '.product-box-image-wrapper' is not sibling of '.add_to_cart_button'?

Scott Hunter Over a year ago

oh sorry no, the sibling is an a tag and the wrapper is inside that. Sorry to be confusing.

Ram Over a year ago

@ScottHunter No problem. Please post the related markup!

Scott Hunter Over a year ago

Ive added the markup, sorry its a bit of a mess, didnt know how to get it here properly

|

Collectives™ on Stack Overflow

jQuery append to a sibling div

1 Answer 1

8 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Related