0

I use iambriansreed code from this topic to bold some text and its works fine. But i want to find multiple words like BMW, Mini Cooper etc in all title ID's on the same page and its not working. Here is example http://zazl.linuxpl.info/title/ Any ideas? Im not jquery programmer at all.

Here is code:

$(window).load(function() {
    // ADD BOLD ELEMENTS
    $('#titleh:contains("Mini Cooper")').each(function(){
        $(this).html( 
            $(this).html().replace(/Mini Cooper/g,'<span class="firstWord">$&</span>')
        );
    });

    $('#titleh:contains("BMW")').each(function(){
        $(this).html( 
            $(this).html().replace(/BMW/g,'<span class="firstWord">$&</span>')
        );
    });
});

I ask new question in accordance with AlexKM answer in mentioned topic.

Community
  • 1
  • 1

1 Answers1

0

The reason it doesn’t work, is because you have multiple elements with the same ID in your document. So when you select an element by ID, it just selects the first element with that ID.

In HTML documents, IDs must be unique. Use classes instead:

<span class="titleh">...</span>

For your JavaScript:

$(window).on('load', function() {
    $('.titleh').each(function() {
        var $e = $(this),
            html = $e.html();

        html = html.replace(/Mini Cooper/g, '<span class="firstWord">$&</span>');
        html = html.replace(/BMW/g, '<span class="firstWord">$&</span>');
        /* Add more rules here */

        $e.html(html);
    });
});
Tim S.
  • 13,597
  • 7
  • 46
  • 72