Assume that I have some HTML elements like these :
<div id="content_div">
<span><a href="some_link">Click me</a></span>
<div> Hello everybody. Click <a href="some_link_else">me</a> to do something else</div>
<a href="3rd_link"> Oops </a>
</div>
All that I need is get all "a" tags in the #content_div and disable all of them (I don't want user to click on them). How could I do that in Jquery?
Try this:
$("#content_div a").click(function(e) {
e.preventDefault();
});
I would rely less on jQuery as it might be disabled by the user, so if you want a CSS solution, you can do it like
#content_div {
pointer-events: none;
cursor: default;
}
Demo
Edit: To be precise, use this declaration #content_div a
$("#content_div a").css({"color":"#888888", cursor: "default"}).click(function(e){
e.preventDefault();
});
Working Example http://jsfiddle.net/P4Fqq/
There are two ways here:
1) $('#content a').css({"pointer-events":"none"});
2) $('#content a').click(function(e){ e.preventDefault(); });