How to translate an HTML structure to XML?

Suppose I have HTML structured like this:

<div class="veggie">carrot</div>
<div class="veggie">cucumber</div>
<div class="fruit">
  <div class="citrus">orange</div>
  <div class="citrus">lemon</div>
  <div class="berry">grape</div>
</div>
<div class="veggie">lettuce</div>
<div class="dairy">milk</div>

But it's all on a single line like this:

<div class="vegetable">carrot</div><div class="vegetable">cucumber</div><div class="fruit"><div class="citrus">orange</div><div class="citrus">lemon</div><div class="berry">grape</div></div><div class="vegetable">lettuce</div><div class="dairy">milk</div>

How can I translate it to XML like this:

<veggie>carrot</veggie>
<veggie>cucumber</veggie>
<fruit>
  <citrus>orange</citrus>
  <citrus>lemon</citrus>
  <berry>grape</berry>
</fruit>
<veggie>lettuce</veggie>
<dairy>milk</dairy>

It sounds straightforward, but I have no clue where to start!