Sortable mit zwei verschiedenen Elementen

[blabla333]

<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>

<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>

<section>Element wird z.B. hier hin verschoben</section>

<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>

<section>Element</section>
<section>Element</section>
<section>Element</section>

Ist es möglich, dass ich die Section-Elemente sortieren kann, dabei aber die p-Elemente auch berücksichtigt werden?
Oder anders formuliert: Ich möchte z.B. die unteren Section-Elemente sortieren können, wobei ich ein solches Element auch zwischen einen p-Abschnitt verschieben kann (wie in dem obigen Beispiel). Die p-Elemente selbst sollen nicht sortierbar sein.

Grundsätzlich würde ich auf jQuery UI zurückgreifen, es sei denn es gäbe für diese Anforderung etwas "besseres".
Weiterhin denke ich, dass ich mit "connectWith:" arbeiten muss, allerdings habe ich in meinem Code keine bestimmten Klassen. Muss ich die section-Elemente als sortable setzen und diese mit "p" verbinden?

 

[blabla333]

So geht es:

sortable({
        items: "section, p",
        cancel: "p"
    })

Habe aber noch das Problem, dass meine Section-Elemente das Attribut contenteditable haben. Durch das "sortable" kann ich das Element nun packen und verschieben, aber leider nicht mehr editieren.

Hat dazu jemand eine Idee?