html5 - jQuery can't change class of all spans inside a div -
in following example, how can change class of <span>
inside particular h2
<div>
, while leaving 1 clicked unchanged?
<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>side bar voting thingy</title> <style type="text/css"> .hide { display: none; } .no-like { color: blue; } </style> <script type="text/javascript" src="http://localhost/site/scripts/jquerycore.js"></script> <script type="text/javascript"> $(function() { $(".like").click(function() { var haslike = $(this).data("id"); var data = 'id='+haslike; console.log($(this).data('id')); if(haslike) { // ajax call $.ajax({ type:"get", url:"demo.php", data:data, beforesend:function(html){ // we'll think of here }, success: function(page_data){ // remove class like, add class no-like $('.like[data-id="'+page_data+'"]').removeclass('like').addclass('no-like'); //change class other links other 1 user clicked //hard coded example $('.h2[data-id="9"]').siblings('.like').removeclass('like').addclass('hide'); }, error: function(yikes){ //to later }, }); } return false; }); }); </script> </head> <body> <div id="container"> <div class="h1" data-id="1">teachers</div> <div class="h2" data-id="2">who favorite math teacher? <div>* homer simpson   <span class="like" data-id="3" data-sec="2">like</span></div> <div>* elmer fudd   <span class="like" data-id="4" data-sec="2">like</span></div> <div>* bugs bunny   <span class="like" data-id="5" data-sec="2">like</span></div> <div>* obelix   <span class="like" data-id="6" data-sec="2">like</span></div> <div>* mojo jojo   <span class="like" data-id="7" data-sec="2">like</span></div> </div> <br> <div class="h1" data-id="8">restaurants</div> <div class="h2" data-id="9">which favourtie restaurant in town? <div>* mcdonalds   <span class="like" data-id="10" data-sec="9">like</span></div> <div>* kfc   <span class="like" data-id="11" data-sec="9">like</span></div> <div>* heart attack grill   <span class="like" data-id="12" data-sec="9">like</span></div> <div>* in-n-out   <span class="like" data-id="13" data-sec="9">like</span></div> <div>* popeye's   <span class="like" data-id="14" data-sec="9">like</span></div> </div> </div> </body> </html>
i need select particular h2
<div>
in page. there may many more.
success: function(page_data){ // remove class like, add class no-link $('.like[data-id="'+page_data+'"]').removeclass('like').addclass('no-like'); //change class other links other 1 user clicked //hard coded example $('.h2[data-id="9"]').siblings('.like').removeclass('like').addclass('hide'); },
change spans class, , add $(this).removeclass("class_name");
Comments
Post a Comment