Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Göran Joelsson
Göran Joelsson
11,710 Points

Move an a href

Hi I would like to loop over some HTML and move a link within each class "contentwrapper" to within the class "head" instead.

Here's an example, this code;

<div class="itembox newtriplebox">
<div class="mainhead"> </div>
<div class="mainbody">
<div class="left">
<div class="head">
<h4>
Some text
<br>
Some more text
</h4>
</div>
<div class="body">
<div class="item">
<div class="contentwrapper">
<a title="" href="/a/link/somewhere">  <---- This is what I would like to move
<div class="promo-head">
<div class="promo-img img">
<img alt="">
</div>
</div>
</a> <---- This is what I would like to move

Should look like this;

<div class="itembox newtriplebox">
<div class="mainhead"> </div>
<div class="mainbody">
<div class="left">
<div class="head">
<a title="" href="/a/link/somewhere">  <---- Moved here
<h4>
Some text
<br>
Some more text
</h4>
</div>
</a> <---- Moved here
<div class="body">
<div class="item">
<div class="contentwrapper">
<div class="promo-head">
<div class="promo-img img">
<img alt="">
</div>
</div>

This content is dynamically created for many objects, so I guess I therefore I need to loop through each block.

Any suggestions is very much appreciated!

Thanks

// Goran

1 Answer

Daniel Newman
PLUS
Daniel Newman
Courses Plus Student 10,715 Points
Daniel Newman
Daniel Newman
Courses Plus Student 10,715 Points

Are you sure that you want to move whole links inside .contentwrapper?

var wholeContentLinks = $('.contentwrapper a');

Do you want to move the first one only?

var firstContentLink = wholeContentLinks[0]; // or
var firstContentLink = $('.contentwrapper a')[0];

$(firstContentLink)
      .prependTo(".head");
//    .appendTo(".head"); to put it at the end of head