Remove Class from parent div inside ASP.Net Repeater element

Hi Friends,

I have placed the below code inside a Repeater in which runs 3 times and the class "msg_txt" inside the div have border in the bottom.

  <div class="msg_txt">
        <h3 class="head1"><%#Eval("Heading1")%></h3>
    </div>
  <div class="msg_txt">
        <h3 class="head2"><%#Eval("Heading2")%></h3>
    </div>
  <div class="msg_txt">
        <h3 class="head3"><%#Eval("Heading3")%></h3>
    </div>
  <div class="msg_txt">
        <h3 class="head4"><%#Eval("Heading4")%></h3>
  </div>

So when the Heading1,Heading2,Heading3,Heading4 are not contain any data the repeater display only borders which looks odd.

I have tried jQuery as below to remove the parent clasas "msg_txt" when the child <h3> tag is empty but it will remove the border of the First occurrance of the heading1,2,3 and 4:

&lt;script type="text/javascript">
var head1=$('.head1').text();
var head2=$('.head2').text();
var head3=$('.head3').text();
var head4=$('.head4').text();

  if($('.head1').text()=='' || $('.head1').text()=='undefined')
    {
     var parentTAG_H1= $('.head1').parent();
     $(parentTAG_H1[0]).removeClass('msg_txt');
    }
  if($('.head2').text()=='' || $('.head2').text()=='undefined')
    {
     var parentTAG_H2= $('.head2').parent();
     $(parentTAG_H2[0]).removeClass('msg_txt');

   }
  if($('.head3').text()=='' || $('.head3').text()=='undefined')
   {
     var parentTAG_H3= $('.head3').parent();
     $(parentTAG_H3[0]).removeClass('msg_txt');
   }
  if($('.head4').text()=='' || $('.head4').text()=='undefined')
   {
     var parentTAG_H4= $('.head4').parent();
     $(parentTAG_H4[0]).removeClass('msg_txt');
   }

Any suggesstion will be appreciated...Thanks