Question

I think I’ve almost got it, but I’m newish to jQuery and must be overlooking what the problem is.

Here is my code.

// <![CDATA[

var root = null;

$(document).ready( function(){

    $.get( "/_assets/xml/sitemap.xml", 
        function( data ) {
            root = data;
            var pathname = window.location.pathname;

            var local_url = "*[url=" + pathname + "]";
            var currpage = $(root).find(local_url).attr("name");
            var parentEls = $(root).find(local_url).parents();

            var mapped = $(parentEls).map(function () { 
                  var element = $(this).attr("name");
                  var element_url = $(this).attr("url");
                  var element_wrap = $(element).wrap('<a href=' + element_url + '/>');
                  return element_wrap; 
                    })
                .get()
                .reverse()
                .join(" / ");

            $("#breadcrumb").append("<p>" + mapped + " / " + currpage + "</p>");

        } );
} );

// ]]>

Here is where I’m having trouble:

var mapped = $(parentEls).map(function () { 
                  var element = $(this).attr("name");
                  var element_url = $(this).attr("url");
                  var element_wrap = $(element).wrap('<a href=' + element_url + '/>');
                  return element_wrap; 
                    })

What I’m trying to do is wrap each element in an <a> tag and assign href=element_url. But I keep getting errors. Can anyone see a fix? Thanks!

Answer 1

Quick stab at it:

var element_wrap = $(element).wrap('<a href="' + element_url + '" />');

The change is the double quotes – you were producing a string like this:

<a href=http://somewhere.come />

but you wanted

<a href="http://somewhere.come" />