twitter-bootstrap: how to get rid of underlined button text when hovering over a btn-group within an <a>-tag?

Question

Using the markup below, the button text is underlined when hovered over. How can I get rid of that behavior?

Is there a better way to add links to a btn-group in bootstrap that avoids this behavior?

<a href="#">
    <div class="btn-group">
        <button class="btn">Text</button>
        <button class="btn">Text</button>
    </div>
</a>

Tested CSS lines:

a:hover .btn-group { text-decoration: none }
a .btn-group:hover { text-decoration: none }
a:hover .btn-group .btn { text-decoration: none }
a .btn-group .btn:hover { text-decoration: none }

Any additional !important does not work, either (suggested by baptme).

How to solved?

{ text-decoration: none !important}

EDIT 1:

例として a{text-decoration: none} が動作します。

のデフォルトの挙動を妨げないように、クラスで <a> タグを使用することができます。

<a href="#" class="nounderline">
  <div class="btn-group">
    <button class="btn">Text</button>
    <button class="btn">Text</button>
  </div>
</a>

CSSです。

.nounderline {
  text-decoration: none !important
}