JQuery Selector for dynamic id

Question

I am trying to change the image source in the Jquery

<a href="" class="wanted" id="'.$status_id[$num].'"><img src="/images/wanted.png">

through a JQuery selector:

$(".wanted "+ id).attr("src", '/images/wanted_.png');

Where id is defined in the javascript as the php variable $status_id[$num]. I first tried using $(this) to no avail. Any insight would be helpful.

Answer 1

When you access $(".wanted"+id) , you are actually trying to access an element with the class name = wanted+id. This is because of the '.' before 'wanted'. Also, you seem to be accessing the <a> tag directly and setting it's src attribute. You need to access the <img> tag. What you could try is this:

var x=document.getElementById(id);
$(x).find("img")[0].setAttribute("src","/images/wanted_.png");

Answer 2

ID of the HTML elements should be unique across the page.

You can try

//I assume id variable is already assigned the id of the element e.g var id = "<?php echo $status_id[$num] ?>";

$("#"+ id).attr("src", '/images/wanted_.png');

If you really want to select an element that has the given id and also the class wanted then try this:

$("#"+ id + ".wanted ").attr("src", '/images/wanted_.png');