i am new to jquery and i am trying to swap or move an element with another element, but it's not working completely.

I have following html:

2. <div id=content>
3. <div class=c1>
4. <a href="link1"><img src="" alt=""></a>
5. <h2>Headline 1</h2>
6. <p>...</p>
7. <p>...</p>
8. </div>
9. <div class=c2>
10. <a href="link2"><img src="" alt=""></a>
11. <h2>Headline 2</h2>
12. <p>...</p>
13. <p>...</p>
14. </div>
15. <div class=c3>
16. <a href="link3"><img src="" alt=""></a>
17. <h2>Headline 3</h2>
18. <p>...</p>
19. <p>...</p>
20. </div>
21. </div>

And I want that it looks like following html when an if-condition gets true:

2. <div id=content>
3. <div class=c1>
4. <h2>Headline 1</h2>
5. <a href="link1"><img src="" alt=""></a>
6. <p>...</p>
7. <p>...</p>
8. </div>
9. <div class=c2>
10. <h2>Headline 2</h2>
11. <a href="link2"><img src="" alt=""></a>
12. <p>...</p>
13. <p>...</p>
14. </div>
15. <div class=c3>
16. <h2>Headline 3</h2>
17. <a href="link3"><img src="" alt=""></a>
18. <p>...</p>
19. <p>...</p>
20. </div>
21. </div>

I tried this

1. function myFunc() {
2.       var picHTML = $('div#content > div.c1 > a').html();
3.       if (condition) {
4.             $('div#content > div.c1 > h2').after(picHTML);
5.       }
6. }

...but it's not working like i want.