title: How to change css properties on hover parent element?
body: <p>I have this table:</p>
  
  <pre><code>&lt;table&gt;
    &lt;tr&gt;&lt;td class="momdad"&gt;&lt;i class='glyphicon glyphicon-cog'&gt;&lt;/i&gt; Hello &lt;/td&gt;&lt;td&gt; Mom &lt;/td&gt;&lt;/tr&gt;
    &lt;tr&gt;&lt;td class="momdad"&gt;&lt;i class='glyphicon glyphicon-cog'&gt;&lt;/i&gt; Hello &lt;/td&gt;&lt;td&gt; Dad &lt;/td&gt;&lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>And I want to show that Icon on class "momdad" hover, because is actually hidden, as you can see in this css:</p>
  
  <pre><code>i{
    visibility: hidden;
  }
  </code></pre>
  
  <p>Is possible to make something like this?:</p>
  
  <pre><code>.momdad:hover{
      i{
          visibility: visible;
      }
  }
  </code></pre>
  
  <p>Thanks for your time.</p>