How would I represent the following menu structure in JavaScript?
<pre><code>Soccer
  Australia
    Melbourne
    Sydney
  New Zealand
    Christchurch
Tennis
  United Kingdom
    Kensington
    London
    Manchester
</code></pre>

<p>I have tried multidimensional arrays however it becomes awkward because of the different lengths. I have also experimented with key/value pairs however again I encountered difficulty because in a way there are only values and no keys. I have tried to represent the hierarchy visually.  To clarify Sydney is a child of Australia. Australia is a child of Soccer. Soccer is a sibling of Tennis and so on.</p>

<p>Edit: I'm looking for a solution that does not require any knowledge of the actual data.  In other words I could swap out "Soccer" with "Baseball" and a simple algorithm which just prints out the data structure should not break.</p>
