Make onClick function that will switch textarea place
<p>I have the following code:</p>

<blockquote>
<pre><code>      var counter=0; 
     function appendText(){     
     var text = $("#text").val();
if ($("#text").val()){      
</code></pre>
</blockquote>

<pre><code>var textArea = "&lt;div&gt; &lt;textarea id='t"+counter+"'&gt;"+text+
    "&lt;/textarea&gt;&lt;button id='b"+counter+"' name='t"+counter+"' &gt;edit&lt;/button&gt; &lt;button onClick='moveUp();'&gt;Up&lt;/button&gt;&lt;/div&gt;"; 


    $("#addedText").after(textArea);    
    $("#t"+counter).attr('readonly','readonly');    
    $("#t"+counter).attr('readonly','readonly');

    $("#t"+counter).css('width','500px');
$("#t"+counter).css('resize','none');
$("#t"+counter).css('background-color','#5CCCCC'); 
$("#t"+counter).css('font-weight','bold');             

$("#b"+counter).bind('click',makeAreaEditable);                  
counter++;  }   else{   }            };                                                                 


 var makeAreaEditable = function() {
 var target = event.target||event.srcElement||event.originalTarget;     
 var targetArea =$("#"+target.name);    
 targetArea.removeAttr('readonly');     
 var button =  $("#"+target.id);    
 button.text("OK");     
 button.unbind('click');
 button.bind('click',saveEdit); };

  var saveEdit =  function() {  
  var target = event.target || event.srcElement || event.originalTarget;    
  var button =  $("#"+target.id);   
  button.text("edit");  
  button.unbind('click');
  button.bind('click',makeAreaEditable);    
  var targetArea = $("#"+target.name);  
  targetArea.attr('readonly', 'readonly'); };
</code></pre>

<p>I can't figure out how can i make the moveUp() function so that it would move textarea up one space. The textarea that is before should switch places with the one that you pushed the Up button.</p>

<p>The html looks like this: </p>

<pre><code> &lt;textarea id="text" placeholder="baga text aici"&gt;&lt;/textarea&gt; &lt;button
 id="addText" onClick="appendText()" &gt;Add text &lt;/button&gt;        &lt;div
 id="addedText" style="float:left"&gt;&lt;/div&gt;
</code></pre>
