jquery - Create element and then drag it increasing the width -

I'm trying to create an element inside another container and then drag it into its width Drag.

I can not make it just codepen please check it Thank you

  document.addEventListener ("DOMContentLoaded", init, false); Function init () {var i, positionId = []; {PositionId [i - 1] = document.getElementById (i.toString ()) for (I = 1; i & lt; 7; i ++); Status ID [i-1] .addEventListener ("Mosudown", Getposition, False); }} Function getPosition (e) {var x; Console.log (e); X = e.offsetX; $ (Document.createElement ('div')) .addClass ('time-sch-div'). Attachments (e.toElement). Css ('left', x); $ ('Time-sc-div') Druggable ({axis: "x"}); }  

Why do not you animate jquery? It's very easy and convenient