• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 427
  • Last Modified:

jQuery hide show dt dd row

What would be the preferred way to hide or show the dt and dd for discount?

<dl class="total-line">
                    <dt>Subtotal:</dt><dd>$211.55</dd>
                    <dt>Shipping:</dt><dd>$5.55</dd>
                    <dt>Tax:</dt><dd>$0</dd>
                    <dt>Discount:</dt><dd>-$5.55</dd>
                    <dt>Grand Total:</dt><dd>$211.55</dd>
 </dl>
0
JRockFL
Asked:
JRockFL
  • 3
  • 2
2 Solutions
 
Gurvinder Pal SinghCommented:
//to hide
$(".total-line dt").last().hide();
$(".total-line dd").last().hide();

//to show
$(".total-line dt").last().show();
$(".total-line dd").last().show();
0
 
leakim971PluritechnicianCommented:
what about :
$( ".total-line dd:eq(" + $("dt:contains('Discount')").hide().index(".total-line dt") + ")" ).hide();

Open in new window

0
 
Gurvinder Pal SinghCommented:
or even

//to hide
$(".total-line dt").last().hide().next("dd").hide();

//to show
$(".total-line dt").last().show().next("dd").show();
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
Gurvinder Pal SinghCommented:
Sorry, i was working on last item rather than 'Discount' one

make it

//to hide
$(".total-line dt").last().prev("dt").hide().next("dd").hide();

//to show
$(".total-line dt").last().prev("dt").show().next("dd").show();

if the order of the items is not fixed, then
$(".total-line dt").each(function(){
  if ($(this).html().indexOf("Discount") != -1)
  {
     $(this).show(); \\or use hide() for hiding
     $(this).next().show(); \\or use hide() for hiding
  }
});
0
 
JRockFLAuthor Commented:
Could I just add a id to the discount dt and dd?
0
 
JRockFLAuthor Commented:
nevermind, this works great.

f the order of the items is not fixed, then
$(".total-line dt").each(function(){
  if ($(this).html().indexOf("Discount") != -1)
  {
     $(this).show(); \\or use hide() for hiding
     $(this).next().show(); \\or use hide() for hiding
  }
});
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now