josecarlos josecarlos - 3 years ago 60
jQuery Question

Swapping text equal in different divs and classes

I have several boxes of cards on one page, these boxes can come dynamically in different, not upper right corner has a text for the click to open the accordion type content, for each class I have to do an action as below, I think of something Regardless of the number of classes.

*new

I do not know how to explain it, I'll try a summary:
Change the text of only one div when clicking, because when I click on the item in the box it changes all the other texts of the
Other boxes.

$('.change-1').click(function () {
var $mudartxt = $('.mudartexto');
if ($mudartxt.text() == 'expandir')
$mudartxt.text('ocultar');
else {
$mudartxt.text('expandir');
}
});

Answer Source

You need to find the current clicked item.

For that you can use the event object

$('.change-1').click(function (e) {
    // Get current target as jquery object
    var $target = $(e.currentTarget);
    // Find mudartexto in current target.
    var $mudartxt = $target.find('.mudartexto');
    if ($mudartxt.text() == 'expandir')
        $mudartxt.text('ocultar');
    else {
        $mudartxt.text('expandir');
    }
});
.change-1 {
display:inline-block;
width:200px;
height:50px;
text-align: center;
background-color:#dfdfdf;
clear: both;
float: left;
margin-top:10px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="change-1">
  <div class="mudartexto">expandir</div>
</div>
<div class="change-1">
  <div class="mudartexto">expandir</div>
</div>
<div class="change-1">
  <div class="mudartexto">expandir</div>
</div>
<div class="change-1">
  <div class="mudartexto">expandir</div>
</div>

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download