CODEWITHSUNDEEP
jquerydomelementthis
hellomello
hellomello

Reputation: 8587

Looking for specific class when clicked

I have two div containers:

<!-- button1 -->
<div class="voted">
    <span>name</span>
    <div class="button">Vote</div>
</div>

<!-- button2 -->
<div class="vote">
    <span>name</span>
    <div class="button">Vote</div>
</div>

Then when using jquery:

$('.button').click(function(){
    // if button2 was clicked:
    var test = $(this).parent().attr("class"); // How do I obtain the other element?
    alert(test); // this should be outputted "voted"
});

I would like to use something like $(this) with some function to get the other element. How would I obtain "voted"? The reason I'm doing this is because I have a script where it will change between two buttons, so when user clicks on button1, I would like them to get class of button2, vice versa.

EDIT

So I have two buttons (to compare two people), initially, they're supposed to have the same class vote. But I have jQuery codes that when a user clicks on a button, the class changes to voted. Now, I would like to check so that when a user clicks on the OTHER button (to try to vote for the second person), they can't because there's already a voted class, or they already pressed the first button.

I know that I can just check my whole page if voted exists, but I have set up some check when user clicks on their initial voted person that they voted for, they can take back the vote (which will change the div class back to vote).

My whole premise is: not to allow user vote the other person if user already voted for someone.

Sorry for the long description.

Thanks!

Upvotes: 1

Views: 120

Answers (6)

hellomello
hellomello

Reputation: 8587

I solved what I'm trying to do

var voted = $(".voted").not($(this).parents(".voted")).attr("class");

This allows me to check if class voted exists, but it doesn't check if $(this) one that was pressed exists.

Upvotes: 1

Sibu
Sibu

Reputation: 4617

It seems you want to get first div's class

$('.button').click(function(){
      var test = $('div:first').attr("class"); // this will give first div's class
      alert(test); // this should be outputted "voted"
    });

DEMO

Upvotes: 0

Ram
Ram

Reputation: 144689

You can use siblings method.

$('.button').click(function(){
  var $this = $(this).parent();
  var c1 = $this.prop('class');
  var c2 = $this.siblings('div').prop('class');
  // console.log('class 1: ' + c1 + ', class 2: ' + c2)
});

Upvotes: 0

VinayC
VinayC

Reputation: 49195

I am not sure what exactly you want to achieve but all if you want to do is toggling between classes then you can use toggleClass 

$('.button').click(function(){ 
   $(this).toggleClass('vote').toggleClass('voted'); 
});

You can always test against specific class name ('vote') to get the other class('voted'). Is there anything that prevents you from assuming hard coded class names?

Upvotes: 0

Rahul
Rahul

Reputation: 988

$(function(){
        $('.button').click(function () {
            // if button2 was clicked:
            var test = $(this).parent().attr("class"); // How do I obtain the other element?
            alert(test); // this should be outputted "voted"
        });
    });

this code works fine for me.

Upvotes: 0

lucassp
lucassp

Reputation: 4167

$(this).parent().prev().children('.button');

This gets you a reference to the jQuery object containing the parent's previous sibling's children with class 'button'.

Upvotes: 0

Related Questions