jQuery to target each #hdid

Question

I'm trying to clean up this function to target individual #hdid. I'm also using $this, but with no success.

<script>
 $(function() {
 $(".delete").click(function() {
 $('#load').fadeIn();
 var commentContainer = $(this).parent();
 // var id = $this.(".delete").val();
 // var string = id ;
 // console.log(id);
 $.ajax({
 type: "POST",
 url: "delete-class.php",
 data: {hdid: $('#hdid').val()},
 cache: false,
 success: function(){
 commentContainer.slideUp('slow', function() {$(this).remove();});
 $('#load').fadeOut();
 //console.log(string);
 }
 });
 return false;
 });
 });
 </script>

Answer 1

If you refactor your code a bit you can do it this way. I'm also making the assumption that you mean .hdid instead of #hdid there should only be one hdid per page if it's really an ID and not a CLASS. Here's a quick sample if you're interested in seeing it in action.

<script>
 var DeleteClass = function(hdid){
 $.ajax{
 type: "POST",
 url: "delete-class.php",
 data: {hdid: hdid.val()},
 cache:false,
 success:function(){
 hdid.parent().slideUp('slow',function(){$(this).remove();});
 }
 }
 $(function() {
 $(".delete").click(function() {
 $('#load').fadeIn();
 $(this).children(".hdid").each(function(){
 DeleteClass($(this));
 });
 $('#load').fadeOut();
 return false;
 });
 });
</script>

• Joseph Silber: Any reason you're using DeleteClass instead of deleteClass? By convention, only Constructor functions should start with an uppercase letter.
• Joseph Silber: Also, please cache you selectors!
• Matt Phillips: no reason, I don't really write a lot of javascript, so I don't know all the conventions. And I realize there's several things I could do to make it a little better. But the gist of it was the each function on hdid.

Answer 2

I think you actually want to do $(this) instead of $this. $this is a reserved word in PHP, not in JS/Jquery, so in your case it's undefined

$(this) on the other hand is the JQuery object of which your callback is a method of (in your case the clicked .delete element)

Just type $(this).val() and you will get the value of the clicked element.

• Matt Phillips: that doesn't answer his question...