How to test a DIV to see if it exists

Okay, I'm using Drupal as a CMS for a client, and they have a specific request. They want a navigation type bar to show up on the left hand side that displays the information about their college programs. However, if they field doesn't contain any information, they don't want the link to show up.

So, my question is, how would I test the div CLASS to see if it exists, and then show or h开发者_运维技巧ide the corresponding link?

Here is my code:

<script>

if ($('.testimonials').length) 
{
    $('#testimon').show();
}
else
{
    $('#testimon').hide();
}   
</script>
<a href="#" id="descrip">Program Description</a><br />
<a href="#" id="admis">Admission Requirements</a><br />
<a href="#" id="career">Career Opportunities</a><br />
<a href="#" id="co_op">Co-Op Diploma</a><br />
<a href="#" id="outcomes">Program Outcomes</a><br />
<a href="#" id="struc">Program Structure</a><br />
<a href="#" id="testimon">Student Testimonials</a><br />
<a href="#" id="transfer">Transferability</a><br />
<a href="#" id="tuition">Tuition and Fees</a><br />

The div I am testing for is given the following class: <div class="testimonials">

Currently, the "Student Testimonials" contains no information, so the div is actually hidden. It doesn't even show up if it doesn't contain anything.

Any help would be great, thanks!

EDIT EDIT EDIT

My apologies, the DIV is not hidden, it's just not populated at all. So, instead of the div showing up, there is actually nothing. It skips that field, and proceeds on to "Transferability".

EDIT EDIT EDIT

Perhaps it will help if you see the code inside the page:

<div class="main_top">

  Business Administration - Business
</div>
<div class="prog_descrip">
  <label>Program description:</label>
    ....SOME CODE....
</div>
<div class="admin_req">
  <label>Admission Requirements:</label>
  <div class="ExternalClassF9C2869A55724649B235CB0F312F44EA">
    ....SOME CODE....
  </div>
</div>
<div class="career_opp">
  <label>Career Opportunities:</label>
  <div class="ExternalClass86EA926232844F31914AB54479958286">
    ....SOME CODE....
  </div>
</div>
<div class="co_op_diploma">
  <label>Co-Op Diploma:</label>
  <div class="ExternalClass921A20DCA14344B4A5B8C320CBBCCAC2">
    ....SOME CODE....
   </div>
</div>
<div class="prog_out">
  <label>Program Outcomes:</label>
  <div class="ExternalClass2964EBDD55244ABDB4DB35FBCC3DF19F">
    ....SOME CODE....
  </div>
</div>
<div class="prog_struc">
  <label>Program Structure:</label>
  <div class="ExternalClassDE705C7CFB1149ED8C164122009A235E">
    ....SOME CODE....
  </div>
</div>
<div class="transfer">
  <label>Transferability:</label>
  <div class="ExternalClass7A18D2A8B34D458C89E330E9C6FF4B61">
    ....SOME CODE....
  </div>
</div>
<div class="tuition">
  <label>Tuition And Fees:</label>
  <div class="ExternalClassC8C745D8B6FA46F9B3E20E6AC95D0933">
    ....SOME CODE....
  </div>
</div>

.toggle() takes a boolean (show/hide)

  $('#testimon').toggle($('.testimonials:not(:empty)').length);

I think just wrapping the code you already have in the document ready snippet will do the trick.

$(document).ready(function(){ 

      if ($('.testimonials').length) 
      {
          $('#testimon').show();
      }
      else
      {
          $('#testimon').hide();
      }   

 });

Just put that code in the head of your HTML page inside a script tag.

have you tried

$("div:first-child")

If the DIV is there but hidden because it has no content, you can try

$(".testimonials").is(':visible')

Seems like you'll need a reusable function as well:

function isHidden(elm,target) {
    // if whether it is non-existent, or hidden via css
    if (elm.length===0 || elm.is(":hidden")) { 
        target.hide();
    }
}

var elm = $(".testimonials"), target = $("#testimon");
isHidden(elm,target);