Making Movable Menu Items In Html

Making movable menu items in html, I have four menu items arranged in right corner of my site vertically one below the other like Home Services Contact About Now i need On click

Solution 1:

Here is how you could have the options jump straight to the top when you click them:

$(function() {
  $('#menu').on('click', 'li', function(event) {
    $(event.target).prependTo('#menu');
  });
});

ul {
  padding: 0;
}
li {
  display: block;
  list-style-type: none;
  height: 30px;
  line-height: 30px;
  color: darkblue;
  font-family: sans-serif;
  background-color: #ddd;
  padding-left: 10px;
  margin: 5px10px;
  cursor: pointer;
}

<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><ulid="menu"><li>Home</li><li>Services</li><li>Contact</li><li>About</li></ul>

jsFiddle link