jQuery Inserting a Button After An Anchor

Question

How in jQuery would I add a button directly after an anchor tag? For example, my HTML looks like:

<div style="border-style: solid; border-width: thin; padding: 2px;">
  <center>
    <a target="_blank" href="http://www.mydomain.com/">MyDomain.com</a>
    <b>My Hypertext Link</b>
    <br/>
    Options:
   <a class="theAClass" href="#">Insert button after this anchor</a>
  </center>
</div>

I want to add a button just after the anchor (class="theAClass") but before the "center" tag so the button is centered on the page.

Answer 1

$('.theAClass').after('<button>...</button>')

Should do the trick. That will append the html you specify immediately after the tag.

Answer 2

//Add button after every theAclass link
$('a.theAClass').after('<button type="button">Click Me!</button>');

//Add button after only the first theAclass link
$('a.theAClass:first').after('<button type="button">Click Me!</button>');