Jquery - Using each with variables and an IF statement

0 votes

Spent a good few hours on this now and don't seem to be getting anywhere!

I have 5 related products at the bottom of the page. Currently there is a "was" price showing on these products regardless of if they are discounted. Located above is the actual price, obviously if the product isn't discounted the prices appear will the same, which is not cool.

So I've written a script that checks if the "actual" price is the same as the "was" price, if true it simply removes the "was" Div element. Works fine.

Now the issue I have is making this rule work for multiple elements with he same class in a page. For some reason when I try to pass a variable within an ".each" function, it returns a string which contains all of the Div values for every ".each" element, as oppose to just returning the value for its relative parent element. e.g. "£674£1999.99£674" rather than "£674".

Checks to see if actual price is the same as was price:

    $('.floatleft').each(function() {
    var wasprice = $('.was').text();
    var ourprice = $('.now').text();

    if (wasprice == ourprice) {

    $('div.price-extras').remove();
    $('.productdetails-view .product-price .PricesalesPrice').css('line-height','40px');

};
});

Sample of the HTML code:

<div class="vmproduct-featured">
  <div class=" width20 floatleft">
    <div class="spacer">
      <a href="/store/powertools/tacx-i-magic-t1900-trainer-info" title="Tacx I-Magic T1900 Trainer" class="img-link">
        <img src="/store/product/resized/123_150x150.jpg" alt="123" class="featuredProductImage" border="0">
      </a>
      <div class="clear"></div>     
      <a class="text-link" href="/store/powertools/tacx-i-magic-t1900-trainer-info">Tacx I-Magic T1900 Trainer</a>      
      <div class="clear"></div>
      <div class="was">£674.00</div>
      <div class="now">£674.00</div> 
    </div>
  </div>
  <div class=" width20 floatleft">
    <div class="spacer">
      <a href="/store/powertools/2012-cube-agree-gtc-di2-info" title="2012 Cube Agree GTC DI2" class="img-link">
        <img src="/store/product/resized/12cubeagreegtcdi2_150x150.jpg" alt="12cubeagreegtcdi2" class="featuredProductImage" border="0">
      </a>
      <div class="clear"></div>     
      <a class="text-link" href="/store/powertools/2012-cube-agree-gtc-di2-info">2012 Cube Agree GTC DI2
      </a>      
      <div class="clear"></div>
      <div class="was">£1,999.99</div>
      <div class="now">£2,499.99</div> 
    </div>
  </div>
 </div>

So basically I'm failing at the .each() and need some assistance, please <3

Jun 21 in JQuery by gaurav
• 18,960 points
65 views

1 answer to this question.

0 votes

To get values from elements, you need to use the $.val() method (assuming it's an input element).

var price = $(".element").val();

So price would be 5 assuming the following HTML:

<input type="text" value="5" class="element" />

You could simplify your fee-finding logic by using a ternary operator too:

var fee = ($(".element").val() > 1) ? 250 : 0 ;

So if the value of our input (having the classname 'element') is greater than 1, fee will be 250. Else, fee will be the value of our input (having the id 'price').

answered Jun 21 by rajatha
• 7,440 points

Related Questions In JQuery

0 votes
1 answer

How to move an item programmatically with jQuery sortable while still triggering events?

Hello, $("selector").trigger("sortupdate"); you will have to  pass as second argument  ...READ MORE

answered May 29, 2020 in JQuery by Niroj
• 82,780 points
2,247 views
0 votes
1 answer

How can I select an element with multiple classes in jQuery?

Hello @kartik, If you want to match only ...READ MORE

answered Sep 10, 2020 in JQuery by Niroj
• 82,780 points
1,617 views
0 votes
1 answer

How to scroll to element from bottom to top with a nice animation using Jquery?

Hello @kartik, Assuming you have a button with ...READ MORE

answered Sep 10, 2020 in JQuery by Niroj
• 82,780 points
2,745 views
0 votes
1 answer

How do I check if the mouse is over an element in jQuery?

Hello @kartik, Use this code: $("someelement").mouseenter(function(){ ...READ MORE

answered Oct 5, 2020 in JQuery by Niroj
• 82,780 points
1,035 views
0 votes
1 answer

jquery $.each() for objects

The $.each() works for objects and arrays ...READ MORE

answered Feb 16 in Java by Aditya
• 7,660 points
51 views
0 votes
1 answer

jquery $.each() for objects

each(), which is used to iterate, exclusively, over ...READ MORE

answered Jun 6 in JQuery by Edureka
• 13,640 points
36 views
0 votes
1 answer

jQuery if checkbox is checked

for jQuery  if ($('input.checkbox_check').prop('checked')) { ...READ MORE

answered Jun 20 in JQuery by rajatha
• 7,440 points
27 views
0 votes
0 answers

jQuery: Test if checkbox is NOT checked

I'm having trouble figuring this out. I ...READ MORE

Jun 29 in Web Development by gaurav
• 18,960 points
63 views
0 votes
1 answer

Show/hide content with specific class using jquery

jQuery hide() Method The hide() method hides the ...READ MORE

answered Jun 13 in JQuery by rajatha
• 7,440 points
430 views
0 votes
1 answer

How to shorten repeating code with html function and return tags in jquery

Firstly note that replace() only accepts two arguments, the ...READ MORE

answered Jun 15 in JQuery by rajatha
• 7,440 points
49 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP