Please help me tweak my code! (Trying to dynamically add <a> tag)

Please help me tweak my code! (Trying to dynamically add <a> tag)

I am creating breadcrumbs using XML with the following code:

  1. // <![CDATA[
  2. var root = null;
  3. $(document).ready( function(){
  4.    
  5.     $.get( "/_assets/xml/sitemap.xml",
  6.         function( data ) {
  7.             root = data;
  8.             var pathname = window.location.pathname;
  9.            
  10.             var local_url = "*[url=" + pathname + "]";
  11.             var currpage = $(root).find(local_url).attr("name");
  12.             var parentEls = $(root).find(local_url).parents();
  13.             var mapped = $(parentEls).map(function () {
  14.                   var element = $(this).attr("name");
  15.                   var element_url = $(this).attr("url");
  16.                   var element_wrap = $(this).wrap('<a href="' + element_url + '"/>').attr("name");
  17.                   return element_wrap;
  18.                     })
  19.                 .get()
  20.                 .reverse()
  21.                 .join(" / ");
  22.            
  23.             $("#breadcrumb").append("<p>" + mapped + " / " + currpage + "</p>");
  24.         } );
  25. } );
  26. // ]]>
The breadcrumbs are displaying perfectly, I'm just having a hard time inserting the <a> tag via .wrap() here:
  1. var element_wrap = $(this).wrap('<a href="' + element_url + '"/>').attr("name");
I want to attach a link to each element's URL and return the name of the tag. The <a> tags aren't being applied here, what am I doing wrong?

Thanks for any suggestions!