0

Hai everybody,

<div class="whatever styledark myclass"></div>

I'm interested in the search-add class. This can be search-cancel, search-remove I want to get this class name when i click on the div, how i do i change this class name to other classes in the div.
onclick success remove class seaech-cancel and addclass seaech-add.
anybody plz help me.

This is my query function.

$('.search-cancel').click(function(){


         var personalId =$(this).find('input[type = "hidden"]').val();



            $.ajax({
                type    : "POST",
                cache   : false,
                url     : "/mypeople/addasfriend",
                data    : {
                            personalid: personalId ,

                        },
                success: function(data) {
                alert('Request Successfully Sended!');



                }
            });

    });

this is my template    

<?php foreach($alreadyexist as $al):?>
    <?php if($peoples['id']==$al['personal_id']): ?>
    <div class="search-cta search-cancel wp-arc">
    <input  type="hidden" value="<?php echo $peoples['id'] ?>"  />
        <p>Cancel Request</p>
    </div>
    <?php $displayed = true; ?>
    <?php endif;?>
    <?php endforeach;?>
3
Contributors
4
Replies
18
Views
4 Years
Discussion Span
Last Post by dcdruck
0

try like this:(whenever you want to change the class name )

for adding class propery to a element (i.e div,table,....etc)

$("id-or-name-or-referenceof-ele").addClass("your-class-name-here");

for removing class property of a element

$("id-or-name-or-referenceof-ele").removeClass("your-class-name-here");

it may helpful to you. in case if you have any doubt on my clarification

let me know the status

happy coding

Edited by radhakrishna.p: giving clarity on the solution

0

i think you have to use jquery live() function to effect the chages immediately

i am giving a sample example to apply css dynamically using live() function

here is the code i think it may helps you a lot

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
$(document).ready(function(){

  var style_status = 1;

  $("button").live("click",function(){
  if(style_status == 1){
      $("#my_id").removeClass("mystyle");
      $("#my_id").addClass("mystyle2");
      style_status = 0; 
  }else{
      $("#my_id").addClass("mystyle");
      $("#my_id").removeClass("mystyle2");
      style_status = 1; 
  }

  });
});
</script>
</head>
<style type="text/css">
.mystyle{
    color:green;
    font-size: 100px;
}

.mystyle2{
    color:red;
    font-size: 50px;
}

</style>
<body>

<p>This is a paragraph.</p>
<div id="my_id">asdfasdfdas fasdfas d fasd fasdfasd f </div>
<button>Click me!</button>

</body>
</html>

use live function appropriately as your need then its work fine

let me know the status

happy coding

0

Per the jQuery documentation, "As of jQuery 1.7, the .live() method is deprecated." Instead it recommends that one "use .on() to attach event handlers." For a click event, it could look like $("button").on("click",function(){ /* blah blah code */ }.

Edited by dcdruck: Added link to jQuery.on documentation

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.