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>
LVL 8
JRockFLAsked:
Who is Participating?
 
Gurvinder Pal SinghConnect With a Mentor Commented:
//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
Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
Gurvinder Pal SinghConnect With a Mentor Commented:
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
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.