Jquery - can't get selector of nested div to animate?
<p>I have tried several SEVERAL variations on this but can't get the proper selector of a nested div. I need to animate this div, and since no animations are occurring Im left to conclude Im not grabbing the right selector. </p>

<p>Here is my animation:</p>

<pre><code>$(".lab1").hover(function(){
    $(".panel-group .panel", this).stop(true, false).animate({ marginTop: "-80px;"});  //Trying to get this
    $(".panel", this).stop(true, false).animate({ height: "140px"});

}, function() {
     $("div.panel.panel-default", this).stop(true, false).animate({ marginTop: "0px;"});
    $(".panel", this).stop(true, false).animate({ height: "98px" });
});
</code></pre>

<p>The 2nd line with the marginTop is the one not happening. Ive gone in chrome and tried to use the selector there but nothing works. Here is my html:</p>

<pre><code>&lt;div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true" style = "text-align: left;margin-top: 30px;"&gt;
&lt;div class="lab1"&gt;  &lt;!--CTedit --&gt;
  &lt;div class="panel panel-default"&gt;
    &lt;div class="panel-heading" role="tab" id="headingOne"&gt;
      &lt;h4 class="panel-title"&gt;
        &lt;a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"&gt;&lt;i class="fa fa-plus-square-o"&gt;&lt;/i&gt;&lt;span style="margin-left: 12px; display: inline-block;"&gt;&lt;/span&gt;Lab Focus: Cloud Management with vRealize Operations &amp; &lt;nobr&gt;vRealize Automation&lt;/nobr&gt;&lt;/a&gt;
      &lt;/h4&gt;
    &lt;/div&gt;
</code></pre>

<p>I am trying to get the 2nd panel-default. How can I get the selector?</p>