How to remove specific value from div section using jquery

Question

I have created a div where it contain dynamic labels. I am trying to remove specific value from div section using jquery.I have declared variable which conatin the string if the string matches in the div section string it should get removed from div. Is there any way to to do that?

      <div class="VS" id="MM" style="border:1px solid gray; width:150px;">
      <label class="custom_label_div2" id="lbl1"> XYZ </label>
      <label class="custom_label_div2" id="lbl2"> XYZC </label>
      <label class="custom_label_div2" id="lbl3"> QWER </label>
      <div>

I was trying to do something like this

    var str = XYZ; --- this is my varibale which will contain any label deriving from somewhere else it can contain any one of the value i.e. XYZ or XYZC or QWER
    $('#MM').each(function() {
       var $this = $(this);
       if ($this.text() === str) {
           $this.remove();
       }
    });

Answer 1

if ($this.text() === str) {
           $this.remove();
       }

• this is removing the element itself, if you need to empty it use :

if ($this.text() === str) {
           $this.text("");
       }

or

if ($this.text() === str) {
           $this.html(""); // if there are other elements inside
       }

or just

if ($this.text() === str) {
           $this.empty();
       }

Answer 2

At the moment Your JQuery string finds only the div with id "MM", but You want the child elements so try this:

var str = XYZ;
$('#9MMM > label').each(function() {
    var $this = $(this);
    if ($this.text() === str) {
        $this.remove();
    }
});