jquery - trouble updating nav with ajax content -

i've been able use ajax , php update page, exception of nav content. refuses play along remainder of page.

the nav section in html looks this:

<nav id="nav">     <div id="nav"></div>     <ul>         <li>              <a href="">dropdown</a>         <ul>     </ul>   </nav> 

my ajax looks this:

<script type="text/javascript"> var frm = $('#picker'); frm.submit(function () {     $.ajax({         type: frm.attr('method'),         url: "http://xxxx.com/test.php",         data: frm.serialize(),         success: function (data) {             $("#nav").html ( data );         }     });      return false; }); </script> 

currently php should echo "this code works". it's functional if point other div, refuses work if send nav.

any appreciated. detail driving me batty. if can make work without editing css, appreciated. i'm not skilled in area either, i'm reluctant edit of code, if possible.

update: tried removing line, no success. removing line prior causes other problems.

update2: made edits per suggestions. no luck yet.

<nav id="nav">     <div id="nav2"></div>     </li>        <li>           <a href="">dropdown</a>     <ul>     </ul>        </nav> 

and editing ajax:

        <script type="text/javascript">         var frm = $('#picker');         frm.submit(function () {                    $.ajax({                           type: frm.attr('method'),                           url: frm.attr('action'),                           data: frm.serialize(),                           success: function (data) {                            $("#nav2").html ( data );                           }                           });                     return false;                    });             </script> 

thanks again.

more 1 id of same name isn't allowed in html.
try removing <div id="nav"></div> , should work