Have Geek Brain

JQuery: show / hide html tags if another tag is empty or not

This is my first post here, I have a question that I have searched high and low and cannot find a working answer yet.

The HTML will look like this:

<span class="label">Label:</span>


<span class="value">{{Value}}</span>

Basically, {{Value}} is a variable inserted (or not) through php / mysql. Of course, if {{Value}} is empty, you get the following when the page is rendered:

<span class="label">Label:</span>


<span class="value"></span>

The idea for a shortcut is to be hidden if there is nothing in {{Value}}.

I've tried various examples using the $ (. Value: empty) and if commands, but it hides the .label regardless.

Any suggestions are greatly appreciated.
Thanks in advance,
Rob

+1


a source to share


2 answers 


$(".value").each(function(){
  var value = $.trim($(this).text())
  if(value == ""){
    $(this).prev(".label").hide()
  }
})


PS. It's a good idea to encapsulate the .label.value pair in some LI or DIV

+3


a source


Try



if ($('.value').text() == '') { $('.label').hide(); }
0


a source






More articles:


All Articles