Turn a String into an Anchor with jQuery

The second part of the code below listens to when Google Map markers are clicked and adds the URL to the address bar. How to I get this to instead wrap traditional anchor tags around the urls? e.g. < a href='#test2'>< /a>

        markers[1] = new google.maps.Marker({
            position: sainsburys,
            url: '#test2',
            title: 'Sainsburys',
  开发者_StackOverflow社区          map: map
        });


        for ( i = 0; i < markers.length; i++ ) {
            google.maps.event.addListener(markers[i], 'click', function() {
            window.location.href = this.url;
            });
        }

Full example is here http://jsfiddle.net/BQzLq/8/, although you can't see it working properly because JSFiddle won't allow the URL to be modified.

You can manipulate the window.location.hash property. Manipulating this directly does not cause the browser to scroll, but if you then call call $.localScroll.hash(), it might behave as you want.

window.location

This method uses a temp <div> and innerHTML, but you could completely create the A element with DOM calls if you wanted.

// create anchor
var anchorHtml = "<a href='" + this.url + "'>ANCHOR TEXT</a>";
var tempDiv = document.createElement("div");
tempDiv.innerHTML = anchorHtml;
var anchor = tempDiv.getElementsByTagName("a")[0];

// use anchor
document.body.appendChild(anchor);

You could add a div below the map:

    <div id="linkArea">
    </div>

then you can inject your Anchors into that:

    var anchor = '<a href="' + this.url + '">' + this.title + '</a><br/>';
    $('#linkArea').append(anchor);

The result is you should see your anchors appear where ever you locate the div.