Search code examples
javascriptjqueryhtmltextnextsibling

How to remove the text after input field using jquery?


How can I remove the text after the input in jQuery?

jQuery

<div id="date_filter_si">
    <input type="radio" class="date_action" name="date_action" value="Y" checked=""> year
    <input type="radio" class="date_action" name="date_action" value="W" checked=""> Weekly
</div>

Expected Output

<div id="date_filter_si">
    <input type="radio" class="date_action" name="date_action" value="Y" checked=""> 
    <input type="radio" class="date_action" name="date_action" value="W" checked=""> 
</div>
$( "#date_filter_si:contains('Weekly')" ).remove();

Solution

  • You can use Node.nextSibling property to change next sibling text of element.

    $("#date_filter_si > input")[0].nextSibling.textContent = "";
    

    $("#date_filter_si > input")[0].nextSibling.textContent = "";
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div id="date_filter_si">
      <input type="radio" class="date_action"> year
    </div>

    If you have multiple input and sibling text use this:

    $("#date_filter_si > input").each(function(){
        this.nextSibling.textContent = "";
    });
    

    $("#date_filter_si > input").each(function(){
      this.nextSibling.textContent = "";
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div id="date_filter_si">
      <input type="radio" class="date_action"> year
      <input type="radio" class="date_action"> week
    </div>