How to properly <ins>-markup a <dl><dt><dd>?

Question

I am using <ins> and <del> to markup editorial changes in a document. To make them better readable they are colored in some green and red in addition to <u> and <s>. It all works fine except for the dl-dd-dt lists. There, I use an <ins> all around, but the green color is not preserved neither for the <dt> nor the <dd>.

I am aware that I can add another <ins> to each <dt> and <dd>. But I would, if possible, prefer a more principled approach: After all, the entire text including its indentation should be added and not only the elements, so it would be semantically more accurate to have a single enclosing <ins>.

(I am using Firefox 39.0, should this matter)

ins {
  background: #e4ffe4
}
del {
  background: #ffd0d0
}

<INS>
          Preamble, green
    <DL>
    <DT>dt: underlined but not green
    <DD>dd: underlined but not green
    
    <DT><INS>dt-with-ins, green</INS>
<DD>
  <INS>dd-with-ins, green</INS>

  </DL>
  </INS>

  <HR>
  <A href="http://validator.w3.org/check?uri=referer">Validated HTML</A>

Answer 1

Here you go. Just add an ins dl style.

ins, ins dl {
  background: #e4ffe4
}
del {
  background: #ffd0d0
}

<INS>
          Preamble, green
    <DL>
    <DT>dt: underlined but not green
    <DD>dd: underlined but not green
    
    <DT><INS>dt-with-ins, green</INS>
<DD>
  <INS>dd-with-ins, green</INS>

  </DL>
  </INS>

  <HR>
  <A href="http://validator.w3.org/check?uri=referer">Validated HTML</A>