How can I implement a plugin on element with exception of inner element

Question

I have to implement a plugin of highlight on a class of div. The problem that the div contains a span which I don't want to be highlighted.

How can I implement the highlight without affecting the specific span?

I call the highlight plugin with this code:

$('element which should be highlight').highlight('the string to be highlight')

<div class="row clearfix allDiv">
  bla bla hello heloo
 <div class='form-group employe-detail'>
<span class="default-user-avtar">bla bla<span>
<span class="employe-name" >${member?.user?.lastname}, ${member?.user?.firstname}</span>
</div>
</div>

I need something like: $('.allDiv except span with class default-user-avtar').highlight('bla bla')

I tried :

$('.allDiv').not('default-user-avtar').highlight('bla bla') 

It didn't work. All the 'bla bla' in the div include the specific span were highlighted.

Answer 1

So you are using already existed plugin. If it doesn't provide some sort of exclude option the following trick might work.

$('.allDiv').highlight('bla').find('.default-user-avtar').unhighlight();

DEMO