Shouldn't display header if div is empty

I have tabs on my website, but sometimes the tab doesn't contain any info like this:

        <div class="idTabs">
                    <div class="tabIt">
                        <a class="selected" href="#productDetails" name="Tab1">Description</a>
                    </div>
                    <div class="tabIt">
                        <a href="#specs" name="Tab2" class="">Specifications</a>
                    </div>
    开发者_C百科    </div>


  <div class="productInformation">

        <div class="information">

            <div id="productDetails" style="display: block; ">
                   <div class="productInfo">
                   </div>
            </div>
            <div id="specs" style="display: none; ">

            </div>
        </div>

   </div>

How can I make it shouldn't display the tabs if it doesn't contain any information? Thanks

You'll probably need RegEx for that. Something like this:

<script type="text/javascript">
    regex = /(\w)/;

    // div to check to be empty
    div = document.getElementsByClassName('productInfo')[0];

    if(regex.test(div.innerHTML) === false){
        document.getElementById('productDetails').style.display = 'none';
        document.getElementsByClassName('tabIt')[0].style.display = 'none';
    }
</script>

Same with jQuery:

<script type="text/javascript">
    regex = /(\w)/;

    div = $('div#productDetails div.productInfo').text();

    if(regex.test(div) === false){
        $('#productDetails').hide();
        $('.tabIt').first().hide();
    }
</script>

It will also hide the DIV if it contains only whitespaces.

Something like this:

<script type="text/javascript">
    var tab2 = document.getElementsByName('Tab2')[0];
    var specs = document.getElementById('specs');
    if (tab2.className == '') specs.style.display = 'none';
</script>

You should use innerHTML to detect the HTML content within your div like this

<script type="text/javascript">
    if (document.getElementById('specs').innerHTML == '')
        document.getElementById('specs').style.display = 'none';
</script>