CODEWITHSUNDEEP
htmljquery
charlie
charlie

Reputation: 481

JQuery hide elements with a class that starts with a string

I'm trying to hide elements that start with a specific class name.

I've added this to my code $('[class^=webrtc_options_]').hide(); which doesn't seem to be picking up as expected.

HTML output looks like:

<div class="row webrtc_options_B">

Upvotes: 0

Views: 659

Answers (2)

A Paul
A Paul

Reputation: 8251

You can use the "*" operator like below. Because of the "row" class you are getting that issue when using start with operaotr.

$("div[class*='webrtc_options_']").hide();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row webrtc_options_B">ttttt</div>

Upvotes: 2

PeterKA
PeterKA

Reputation: 24638

You may need to break down the class attribute into an array of individual classes:

$('div[class]').filter(function() {
    return $(this).attr('class').split(' ').some(function(a) {
        return /^webrtc_options_/.test(a);
    });
})
.hide();

DEMO

$('div[class]').filter(function() {
    return $(this).attr('class').split(' ').some(function(a) {
        return /^webrtc_options_/.test(a);
    });
})
.hide();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row webrtc_options_B">ONE</div>
<div class="row xwebrtc_options_D">TWO</div>
<div class="webrtc_options_C row">THREE</div>
<div class="row">FOUR</div>

Upvotes: 0

Related Questions