How to insert ajax result after <a> element

How to insert ajax result after <a> element

Hello,

<div class="main">
    <div class="subject">
        <span>Subject2 talks about...<br /></span>
        <a href="#" id="fd_sub2">About Subject2</a><br />
    </div>
</div>

When clicking on <a> element,  I try to get information from an ajax request,
and put result just after <a> element. The ajax result is like <span>Subject is ...</span>

Finally, I must thave

<div class="main">
    <div class="subject">
        <span>Subject2 talks about...<br /></span>
        <a href="#" id="fd_sub2">About Subject2</a><br />
        <span>Subject is ...</span>
    </div>
</div>

I've tried several possibilities using parent, filter, after, prepend
but the result is not good. Either, <span> is wrapped into <a></a> or into <div class="main">.
Please help, mctarek