我所有的div中只有一个是可拖动的

Question

问题在于：我必须在课堂上制作我的p标签＆＃34; .draggable＆＃34;拖动。
我有这段代码：

<div id="dragArea">
        <div class="tab">
            <div class="list" id="traitement">Traitement vidéo</div>
            <p class="items draggable traitement" id="transcoder">Transcoder la vidéo</p>
            <p class="items draggable traitement" id="addLogo">Ajouter un logo</p>
        </div>

        <div class="tab">
            <div class="list" id="publication">Publication</div>
            <p class="items draggable publication" id="genLecteur">Générer un lecteur vidéo</p>
            <hr class="items publication"/>
            <p class="items draggable publication" id="facebook">Publier sur Facebook</p>
            <p class="items draggable publication" id="twitter">Publier sur Twitter</p>
            <p class="items draggable publication" id="dailymotion">Publier sur DailyMotion</p>
            <p class="items draggable publication" id="youtube">Publier sur Youtube</p>
            <p class="items draggable publication" id="vimeo">Publier sur Vimeo</p>
        </div>

        <div class="tab">
            <div class="list" id="divers">Divers</div>
            <p class="items draggable divers" id="mail">Envoyer une notification par mail</p>
        </div>
    </div>

并使这些标签可拖动：

$(".draggable").draggable({
                helper : 'clone',
                cursor : "move",
                revert : true,
                containment : ".bloc.page"
            });

但是当我看到我的页面时，只有最后一个＆＃34; .draggable＆＃34; item（id =＆＃34; mail＆＃34;），可拖动。 我尝试以相同的方式设置红色背景颜色并且它有效，所以我没有发现我的错误。

感谢您的回答。