jqueryのクラス名として変数を渡します

Question

変数 'c​​lassN'にクラス名 'views-row5'があります。これを変数 'c​​lassN'を使用してクラス名 'views-row5'を見つけるためにjqueryに渡したいと思います'' hello 'クラスを追加します。

jQuery(document).ready(function($) { 
 
var classN="views-row5" 
 
$('.carousel-inner li').each(function() 
 
    {$(this).find(classN).addClass('hello');}); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel-inner"> 
 
    <li> 
 
    <div class="views-row4">1</div> 
 
    <div class="views-row5">2</div> 
 
    </li> 
 
    <li> 
 
    <div class="views-row4">1</div> 
 
    <div class="views-row5">2</div> 
 
    </li> 
 
</div>

Answer 1

jQuery(document).ready(function($) { 
 
    var classN = "views-row5" 
 
    $('.carousel-inner li').each(function() { 
 
    $(this).find("."+classN).addClass('hello'); 
 
    }); 
 
});

.hello { 
 
    color: red 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel-inner"> 
 
    <li> 
 
    <div class="views-row4">1</div> 
 
    <div class="views-row5">2</div> 
 
    </li> 
 
    <li> 
 
    <div class="views-row4">1</div> 
 
    <div class="views-row5">2</div> 
 
    </li> 
 
</div>

1. あなたが忘れているあなたが

Answer 2

探しているクラスを見つけること.を追加.は、クラスのためのドットを追加する必要があり、変数の代入では、セレクタ

jQuery(document).ready(function($) { 
 
var classN="views-row5" 
 
$('.carousel-inner li').each(function() 
 
    {$(this).find('.'+classN).addClass('hello');}); 
 
});

.hello{ 
 
color:green; 
 
font-size:20px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel-inner"> 
 
    <li> 
 
    <div class="views-row4">1</div> 
 
    <div class="views-row5">2</div> 
 
    </li> 
 
    <li> 
 
    <div class="views-row4">1</div> 
 
    <div class="views-row5">2</div> 
 
    </li> 
 
</div>

Answer 3

でクラスを表します。このコードを試してみてくださいvar classN=".views-row5"

jQuery(document).ready(function($) { 
 
var classN=".views-row5" 
 
$('.carousel-inner li').each(function() 
 
    {$(this).find(classN).addClass('hello');}); 
 
});

.hello { 
 
color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="carousel-inner"> 
 
    <li> 
 
    <div class="views-row4">1</div> 
 
    <div class="views-row5">2</div> 
 
    </li> 
 
    <li> 
 
    <div class="views-row4">1</div> 
 
    <div class="views-row5">2</div> 
 
    </li> 
 
</div>

Answer 4

のような：

jQuery(document).ready(function($) { 
    var classN="views-row5" 
    $('.' + classN).addClass('hello'); 
});