title: Jquery Draggable not working for appended table row
body: <p>I am trying to make a html table row draggable. it works fine for present element. Here i have one button which has fields to add in a table. this new added field should be appended to html table as row with draggable class drag not working for the newly appended fields.</p>
  
  <p>HTML Table Design Draggable:</p>
  
  <pre><code>&lt;table id=drag_fields &gt;
       foreach($crmfields as $row ) {                                         
          echo '&lt;tr class="drag_row"&gt;';                       
          echo '&lt;td  id="'.$row['crm_field_id'] . '"&gt;' . $row['name'] . "&lt;/td&gt;\n";    
          echo '&lt;/tr&gt;';   
  
       }
  
  
  &lt;/table&gt;
  </code></pre>
  
  <p>Jquery Draggable code:</p>
  
  <pre><code> $("#drag_fields tr").draggable({
           helper: 'clone',
           revert: 'invalid',
           cursor: "move",
           start: function (event, ui) {
  
           $(this).css('opacity', '.5');
            //   sourceElement = $(this).closest('table').attr('id');
  
           },
           stop: function (event, ui) {
             $(this).css('opacity', '1');
  
           }
       });
  </code></pre>
  
  <p>In another button action , I am appending  to the html table, this new appended  not dragging other fields are dragging properly,</p>
  
  <pre><code>$.ajax({
          type: 'POST',
          url: '&lt;?php echo Yii::app()-&gt;createUrl("baseContact/NewEditStructure"); ?&gt;',
          data:data,
          success:function(data){ 
  
            var obj = $.parseJSON(data); 
       /** Appending &lt;tr&gt; here not dragging **/
              $('#drag_fields').append("&lt;tr class='drag_row ui-draggable'&gt; &lt;td id= "+obj['id']+"&gt; "+obj['name']+"&lt;/td&gt;&lt;/tr&gt;");            
  
         },
        error: function(data) { // if error occured
           //alert("Prop Error occured.please try again");
  
      }
    });
  </code></pre>