Search code examples
javascriptjqueryjquery-selectors

how to add classname to all elements starting with specific id?


Before you lash out on me, I know this question might be a possible duplicate. I tried every other post I found on stackoverflow and failed.

I want to add a class name to all elements in my html which start with 'subclass', followed by a single digit number(classid), followed by a random number. I dont exactly know how many elements are there as it is being generated dynamically with servlets.

Following is the code I tried to run:

<style>
.bold {
    font-weight: bold;
}
</style>
<script>
function highlight(classid){
    alert(classid);
    $("p[id^='subclass'+classid]").addClass('bold');
    alert('hello world');
}
</script>
<p id='subclass25'>Hello World </p>

I get the alert for classid but not the alert for 'hello world'. So I know for sure my JQuery is wrong....


Solution

  • You have missed the quotes which is the reason jquery selector is not getting created properly, see below

     highlight('25');
     function highlight(classid){
            alert(classid);
            $("p[id^='subclass" + classid + "']").addClass('bold');
            alert('hello world');
        }
    .bold {
        font-weight: bold;
    }
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <p id='subclass25'>Hello World </p>