我想在里面升级第一个div文本..？

Question

这是我的ul li div结构

点击复选框我希望在div text

中升级我的第一个li

＆＃13;

＆＃13;

    $(".ascsection").click(function(){                 
        var items = $('#Section li').get();
        items.sort(function(a,b){
            var keyA = $("div:first", a).text();
            var keyB = $(b).text();
            if (keyA < keyB) return -1;
            if (keyA > keyB) return 1;
            return 0;
        });
        var ul = $('#Section');
        $.each(items, function(i, li){
            ul.append(li);
        });    
    }); 

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="Section">
       <li>
         <span style="display:flex;">
           <div id="ui-id-2" tabindex="-1" class="abc bethgfont" style="float:left;margin-left: 10px;margin-top: 10px;text-align: left;width: 50%;padding-bottom: 7px;">abc</div>
           <div style="display:none;">27</div>
           <div style="display:none;">Sub Section 1</div>
           <div id="syriacname-27" class="syriacSection" style="float: right;margin-right: 10px;margin-top: 10px;text-align: right;width: 50%;padding-bottom: 7px;">Syriac 1</div>
         </span>
       </li>
       <li>
         <span style="display:flex;">
           <div id="ui-id-2" tabindex="-1" class="abc bethgfont" style="float:left;margin-left: 10px;margin-top: 10px;text-align: left;width: 50%;padding-bottom: 7px;">def</div>
           <div style="display:none;">27</div>
           <div style="display:none;">Sub Section 1</div>
           <div id="syriacname-27" class="syriacSection" style="float: right;margin-right: 10px;margin-top: 10px;text-align: right;width: 50%;padding-bottom: 7px;">ashoka</div>
         </span>
       </li>
    </ul>

 

    <input type="checkbox" class="ascsection" value="" />

＆＃13;

＆＃13;

＆＃13;

提前致谢

此代码正常运行。但是我想在li中仅提升第一个div文本。

Answer 1

我不确定你在问什么，但这会使你的功能适用于div。

    $(".ascsection").click(function(){                 
        var items = $('#Section li div').get();
        items.sort(function(a,b){
            var keyA = $(a).text();
            var keyB = $(b).text();
            if (keyA < keyB) return -1;
            if (keyA > keyB) return 1;
            return 0;
        });
        var ul = $('#Section');
        $.each(items, function(i, li){
            ul.append(li);
        });    
    }); 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="Section">
       <li>
         <span style="display:flex;">
           <div id="ui-id-2" tabindex="-1" class="abc bethgfont" style="float:left;margin-left: 10px;margin-top: 10px;text-align: left;width: 50%;padding-bottom: 7px;">Section</div>
           <div style="display:none;">27</div>
           <div style="display:none;">Sub Section 1</div>
           <div id="syriacname-27" class="syriacSection" style="float: right;margin-right: 10px;margin-top: 10px;text-align: right;width: 50%;padding-bottom: 7px;">Syriac 1</div>
         </span>
       </li>
    </ul>

 

    <input type="checkbox" class="ascsection" value="" />