Solved

jquery click get self

Posted on 2010-11-12
13
324 Views
Last Modified: 2012-05-10
$('.myDiv').click(function(){  
        var myVar = $('.myClass').attr("rel");  
}

This is wrong, I need to specify the myclass for the one inside myDiv not the entire dom document, how do I specify the one that was clicked inside click function(), there could  be any number of myDiv on the page.
0
Comment
Question by:NewtonianB
  • 5
  • 4
  • 3
  • +1
13 Comments
 
LVL 16

Accepted Solution

by:
BurnieP earned 200 total points
Comment Utility
$('.myDiv').click(function(){  
        var myVar = $(this).find('.myClass').attr("rel");  
}

0
 
LVL 13

Assisted Solution

by:darren-w-
darren-w- earned 100 total points
Comment Utility
I think his is it

$('.myDiv').click(function(){  
        var myVar = $(this).attr("rel");  
}
0
 
LVL 13

Expert Comment

by:darren-w-
Comment Utility
Elaborating on this, I think you may need to iterate through all the items to add listeners to them something like:

$('.myDiv').each(function(){
$(this).click(function(){  
        var myVar = $(this).attr("rel");  
});
});
0
 
LVL 13

Expert Comment

by:darren-w-
Comment Utility
oops sorry forget what I said did not read question properly :)
0
 

Author Comment

by:NewtonianB
Comment Utility
Great thank you quick related question

I have a bunch of divs on my site

<div class="searchDiv">
  <a href="" class="myBtn" rel="mydata"></a>
</div>
<div class="searchDiv">
  <a href="" class="myBtn" rel="mydata"></a>
</div>
<div class="searchDiv">
  <a href="" class="myBtn" rel="mydata"></a>
</div>


The jquery I was asking for is to capture the rel in whichever href was clicked.
How can I remove searchDiv from the HTML in jquery also? Basically I'm implementing a delete button, I'd like the searchDiv parent to be removed for the corresponding anchor tag.
IMPORTANT NOTE: My anchor link is actually very deep inside searchDiv so It wouldn't be so smart to call a bunch of parent tags.
Basically my question is how can I find the closest parent with the corresponding class?

Please let me know if you would like me to ask this in a different thread. Thanks!
0
 
LVL 16

Expert Comment

by:jmatix
Comment Utility
To get the rel attribute, you can use the script below. But what do you mean by 'remove searchDiv from the HTML'?
$(document).ready(function(){

	$('.myBtn').click(function(){

		var myVar = $(this).attr("rel");

                   alert(myVar);

	});

});

Open in new window

0
Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

 

Author Comment

by:NewtonianB
Comment Utility
I want that div to be removed from the page
0
 
LVL 16

Expert Comment

by:jmatix
Comment Utility
Including the contents i.e, <a href="" class="myBtn" rel="mydata"></a>
?
0
 

Author Comment

by:NewtonianB
Comment Utility
Yes I want the closest parent div called searchDiv to be removed from the html where the child <a href="" class="myBtn" rel="mydata"></a> was clicked
0
 
LVL 16

Expert Comment

by:jmatix
Comment Utility
Try either one.
<script type="text/javascript">

<!-- menu

$(document).ready(function(){

	$('.myBtn').click(function(){

		alert($(this).attr("rel"));

		$(this).parents('.searchDiv').css("display", "none");

	    return false;

	});

});

//-->

</script>





OR





<script type="text/javascript">

<!-- menu

$(document).ready(function(){

	$('.myBtn').click(function(){

		alert($(this).attr("rel"));

		$(this).parents('.searchDiv').html("");

	    return false;

	});

});

//-->

</script>

Open in new window

0
 

Author Comment

by:NewtonianB
Comment Utility
amazing jmatix almost perfect, but instead of hiding or emptying the inner div, is there no such thing as delete div node?
0
 
LVL 16

Assisted Solution

by:jmatix
jmatix earned 200 total points
Comment Utility
You can use remove() as:

<script type="text/javascript">
<!-- menu
$(document).ready(function(){
      $('.myBtn').click(function(){
            alert($(this).attr("rel"));
            $(this).parents('.searchDiv').remove();
          return false;
      });
});
//-->
</script>
0
 

Author Closing Comment

by:NewtonianB
Comment Utility
thanks alot!
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
This article discusses how to create an extensible mechanism for linked drop downs.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now