hide form items with dynamic class name in jquery

I am trying to use class name to hide a class, for example:

$(".Half_Vent").hide(); 

it works fine. But I want to use drop down selection option value to dynamically replace the .Half_Vent, and here is the syntax I use:

$("\"."+ $("#details").val()+"\"").hide(); 

The value solved as .Half_Vent is good, but whole jQuery does not work.

Any idea?

Answers 1

  • $(function(){
    	$("#cambio").on('change', function(){
    		$("."+$(this).val()).hide();
    	})
    })
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <select id="cambio">
      <option value="select">Select</option>
      <option value="muestra">Muestra</option>
      <option value="muestrab">Muestra B</option>
      <option value="muestrac">Muestra C</option>
    </select>
    <div class="muestra">Muestra 1</div>
    <div class="muestrab">Muestra 2</div>
    <div class="muestrac">Muestra 3</div>

    Try this:

    <select id="cambio">
       <option value="select">Select</option>
       <option value="muestra">Muestra</option>
       <option value="muestrab">Muestra B</option>`
       <option value="muestrac">Muestra C</option>
    </select>
    <div class="muestra">Muestra 1 </div>
    <div class="muestrab">Muestra 2 </div>
    <div class="muestrac">Muestra 3 </div>
    
    $(function(){
       $("#cambio").on('change', function(){
           $("."+$(this).val()).hide();
       })
    })
    

    That way you control change


Related Articles