jquery - JQuery の単純な追加クラスが機能しない

Question

       <div class="newstitle">
            <ul class="newstitle">
                @foreach (var item in Model.Content)
                {
                    if (item.Value != null)
                    { 
                     <li>
                            <div class="newstitle_title">@item.Key.Name</div>
                        </li>
                    }
                }
           </ul> 
  </div>

 <script type="text/javascript">
  $(document).ready(function () {
     $('.newstitle li:nth-child(odd)').addClass('last');
 });
 </script>

私はこのコードを持っています。実行しようとしましたが、css が壊れています。

ただし、次のようにする必要があります。画像間の間隔を確認してください。

どうすればこれを修正できますか? div と ul の両方が同じクラス名を持つ場合。

生成された html は次のようになります。

<div class="newstitle">
    <ul class="newstitle">
        <li>image</li>
        <li>image</li>
        <li>image</li>
        <li class="last">image</li>
        <li>image</li>
        <li>image</li>
        <li>image</li>
        <li class="last">image</li>
        <li>image</li>
        <li>image</li>
        <li>image</li>
        <li class="last">image</li>
    </ul>
    </div>

そしてここにcssがあります：

.newstitle  {width:600px;overflow:hidden;margin:15px auto;}
.newstitle li {float:left;width:140px;height:170px;overflow:hidden;margin:0px 13px 0px 0px;display:inline;position:relative;}
.newstitle .last {float:left;width:140px;height:170px;overflow:hidden;margin:0px 0px 0px 0px;display:inline;position:relative;}

Answer 1

これを試して ：

$('li', 'ul.newstitle').filter(function() {return $(this).index()%4===0}).addClass('last');

フィドル

Answer 2

このようなものはどうですか

<script type="text/javascript">
    $(document).ready(function () {
        var $li = $('ul.newstitle li'),
            y = 0;
        for (var i=0, n = $li.length; i < n; i++) {
          if ( y++ === 3 ) {
              $($li[i]).addClass("last");
              y = 0;
          }
        }
    });
</script>

お役に立てば幸いです