Search code examples
javascriptjqueryhtmlyoutubehref

Removing HTML code from a javaScript array?


Hi I have the following code in a javaScript file called songs:

var marchMD = new Array();
marchMD[0] = ["Save the Best for Last - Vanessa Williams"];
marchMD[1] = ["Informer - Snow"];
marchMD[2] = ["The Sign - Ace of Base"];    

for (var i=0;i<marchMD.length; i++) {
    songList = songList + '<p><a href="#" id="songtext">' + marchMD[i] + '</a></p>';
}
$('#songs').html(songList);

Once this has been loaded, the follow javaScript in the file youtube reacts with the code above:

$(document).ready(function() {

    $('#songs p').click(function(e) {

        var $el = $(e.currentTarget);
        var search = $el.html();
        //alert(search);
        //return;

        var keyword = encodeURIComponent(search);
        var yt_url = 'http://gdata.youtube.com/feeds/api/videos?q=' + keyword + '&format=5&max-results=1&v=2&alt=jsonc';

        $.ajax({
            type:"GET",
            url: yt_url,
            dataType: "jsonp",
            success: function(response) {
                if(response.data.items) {
                    $.each(response.data.items, function(i, data) {
                        var video_id = data.id;
                        var video_frame = "<iframe width='420' height='315' src='http://www.youtube.com/embed/" + video_id + "' frameborder='0' type='text/html'></iframe>";
                        $("#ytVid").html(video_frame);
                    });
                } else {
                    $("#ytVid").hmtl("<div id='no'> No Video</div>");
                }
            }
        });
    });
});

The alert that I have in the code above was a test to see if it would return anything and it doesn't. However, if I remove the href html tag from the code this works. The reason I have it is so when someone clicks one of the songs, it takes them to the top of the page to view that song in youtube.

Thanks


Solution

  • If you know that the element that contains your link will only ever contain your link, you could use text() to strip out the HTML formatting, like this:

     var search = $el.text();