How to compare if the div with Event click has a class similar to another div selected?

Asked

Viewed 35 times

0

I have a set of div’s with Event click on jQuery. I’m not sure how to compare the clicked div’s if they have the same icon class. I have a div already selected, if the user click on another div in the same container I want to apply another Vent if she has similar icons comparing the classes of icons if they are equal.

Ex: Selected Div1 has the <i class="fa fa-bicycle"></i> Div2 when clicked should compare with div1 if it also has <i class="fa fa-bicycle"></i> but I don’t know how to make this comparison in jQuery

1 answer

1


Can do using hasClass at each tag click event i, for example;

$('i').on('click', function() {
  var icone = $(this);
  
  if(icone.hasClass('fa-bicycle') == true){
    console.log('Tem a classe');
  } else {
    console.log('Não tem a classe');
  }
})
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div><i class="fa fa-bicycle"></i></div>
<div><i class="fa fa-home"></i></div>
<div><i class="fa fa-bicycle"></i></div>

  • I have several icons, I would have to create an array with their name and fill in each one to test the conditional?

  • To give you a more accurate answer, I would need to see the html. But the on click is already picking up all the icons you have on the page and comparing with the condition.

  • <ul class="deck">&#xA; <li class="card">&#xA; <i class="fa fa-diamond"></i>&#xA; </li>&#xA; <li class="card">&#xA; <i class="fa fa-paper-plane-o"></i>&#xA; </li>&#xA; <li class="card">&#xA; <i class="fa fa-anchor"></i>&#xA; </li>&#xA; </ul> I have this example, there are repeated class pairs that when clicked would close or give Hide, but how to compare if the classes are repeated?

  • Wemerson, you’re a little confused, you say li?

Browser other questions tagged

You are not signed in. Login or sign up in order to post.