Simple DropDown that post and replaces
<p>I am trying to make a dropdown menu that when you click dropdown a (in this case Item 3) the ul is showed and then when you click the li for example Item 2 it is posted and then Item 3 (the text between the a) would be replaced by item 2 and vice versa in the li. So far I have been unsuccessful in doing this. Any help would be greatly appreciated. This is what I have so far:</p>

<pre><code>&lt;div class="dropdown"&gt;
    &lt;a href="#"&gt;Item 3&lt;/a&gt;
    &lt;ul data-id='&lt;?php echo $row['_id'] ?&gt;' data-url='&lt;?php echo Uri::create('edit') ?&gt;'&gt;
        &lt;li&gt; Item 1 &lt;/li&gt;
        &lt;li&gt; Item 2 &lt;/li&gt;
        &lt;li&gt; Item 4 &lt;/li&gt;
        &lt;li&gt; Item 5 &lt;/li&gt;
        &lt;li&gt; Item 6 &lt;/li&gt;
    &lt;/ul&gt;
&lt;/div&gt;



$('.dropdown a').click(function() {
    $(this).parent().children('ul').toggle();
    return false;
});


$('.dropdown li').click(function() {
    var url = $(this).parent().data('url'),
        id = $(this).parent().data('id'),
        status = $(this).text();

$.post(url, { status: status, id: id }, function() {

    });
});
</code></pre>
