Target parent element by href attribute and add content using jquery

Question

this is my current html:

<div>
    <a href="http://example.com">example.com</a>
</div>

I need to add a new div as a last element of this structure. This is what I want to achieve:

<div>
    <a href="http://example.com">example.com</a>
</div>

<div>
    added element
</div>

I need to target it by href attribute. This is what I've tried but it's not working:

jQuery('a[href$="http://example.com"]').parent().append('<div>added element</div>');

T.J. Crowder · Accepted Answer · 2015-05-19 10:48:21Z

2

You were close, but that will append the div within the div that has the anchor in it.

You want to add it next to that div using after rather than append:

jQuery('a[href$="http://example.com"]').parent().after('<div>added element</div>');
// ----------------------------------------------^

Live Example:

jQuery('a[href$="http://example.com"]').parent().after('<div>added element</div>');

<div>
    <a href="http://example.com">example.com</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

answered May 19, 2015 at 10:48

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

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

Collectives™ on Stack Overflow

Target parent element by href attribute and add content using jquery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related