Perform certain action when radio button is checked

.searchFilter {
  display: none;
  /* hide search filters */
}

input[type=radio]:checked~.searchFilter {
  display: block;
  /* show filters that appear after a checked input */
}

<ul class="filters">
  <li class="submenu">Check one
    <div class="details">
      <form>
        <div class="filter-option">
          <input type="radio" id="example" name="role" checked/>
          <label for="example">Example</label>
          <input type="text" class="searchFilter">
        </div>
        <div class="filter-option">
          <input type="radio" id="example1" name="role" checked/>
          <label for="example1">Example</label>
          <input type="text" class="searchFilter">
        </div>
      </form>
    </div>
  </li>
  <li class="submenu">Check two
    <div class="details">
      <form>
        <div class="filter-option">
          <input type="radio" id="example2" name="role" checked/>
          <label for="example2">Example</label>
          <input type="text" class="searchFilter">
        </div>
        <div class="filter-option">
          <input type="radio" id="example3" name="role" checked/>
          <label for="example3">Example</label>
          <input type="text" class="searchFilter">
        </div>
      </form>
    </div>
  </li>
</ul>