Can I use the classlist property to update text within divs in Jquery?

Question

I am trying to use div classes to update text within the divs.

<div class="green paper 15">
<p class="desc">TEST 1</p>
</div>

<div class="blue rock 3">
<p class="desc">TEST 2</p>
</div>

<button value="0">COLOR</button>
<button value="1">CHOICE</button>

<script>
$("button").click(function () {
    var class_val = $(this).val();
        $.each('div', function(index, value) {
            $class_arr = $(this).classList;
            $new_desc = $class_arr[class_val];
            $('p.desc').text($new_desc);
        });
});
</script>

$class_arr throws an undefined error. Where am I going wrong? Thanks for your time.

check this answer: http://stackoverflow.com/questions/1227286/get-class-list-for-element-with-jquery — VVV, Oct 11 '12 at 00:59

score 1 · Accepted Answer · answered Oct 11 '12 at 00:58

1

Jquery does not have a classlist property. Try obtaining the classes as follows:

<script>
$("button").click(function () {
    var class_val = $(this).val();
        $.each('div', function(index, value) {
            $class_arr = $(this).attr('class').split(/\s+/);
            $new_desc = $class_arr[class_val];
            $('p.desc').text($new_desc);
        });
});
</script>

answered Oct 11 '12 at 00:58

Kevin Bowersox

93,289
19
159
189

OK. Got it. Wasn't going over the div's properly: $('div').each(function(index) – Brad Evans Oct 11 '12 at 01:18

score 0 · Answer 2 · answered Oct 11 '12 at 00:58

0

.classList  is not a valid selector..

Try this instead

$class_arr = $(this).attr('class').split(/\s+/);

answered Oct 11 '12 at 00:58

Sushanth --

55,259
9
66
105

Can I use the classlist property to update text within divs in Jquery?

2 Answers2