Ian Mobbs Ian Mobbs - 5 months ago 13
Javascript Question

How can I look for specific instances of an id using jQuery when a page uses the id multiple times?

I'm trying to collect information from a page (http://kvrx.org) about the song, artist, and album it's playing at any given time. I'm trying to load it using jQuery, but the issue here is that the page I'm trying to load uses the same ID multiple times, so I end up getting the same text twice. How can I look for specific instances of an id using jQuery?

HTML

<p>
<span id='song'></span><br />
<span id='artist'></span><br />
<i><span id='album'></span></i><br />
<span id='albumart'></span>
</p>


JavaScript

function updateTags() {
$("#song").load("http:/kvrx.org #track-name");
$("#artist").load("http:/kvrx.org #artist-name");
$("#album").load("http:/kvrx.org #album-name");
$("#albumart").load("http:/kvrx.org #album-artwork");
}


Result (I only want one of each of these lines to show up)

The Black Angels - Empire
Song: The Black Angels - Empire

Various Artists - KVRX
Artist: Various Artists - KVRX

Local Live, Vol. 10: Untitled
Album: Local Live, Vol. 10: Untitled

Answer

i have no idea if this will work or not but you could try:

$("#song").load("http:/kvrx.org #track-name:eq(0)");

Otherwise you will have more control using $.get() and only need to make one request instead of 4

$.get('"http:/kvrx.org', function(html){
   var $song = $(html).find('[id="track-name"]').eq(0);
   $("#song").html($song);
})
Comments