How to show select option with jquery?

Navigation
1

I have a select box that is like display:none and I want to when clicking a button appears the listing for the user to choose but I can not do it I would like some lights on how to do it.

HTML 

<table border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td valign="top">
          <div class="input_home_pequisa">Escolha um distrito 
            <img id="botao_distritos" style="float:right; cursor:pointer; margin-top:4px;" src="img/select_home.png">
            <select style="display:none;" name="teste" id="teste">
              <option value="">teste</option>
            </select>
          </div>
        </td>
        <td valign="top">
          <div class="input_home_pequisa">Escolha um concelho 
            <img id="botao_concelhos" style="float:right; margin-top:4px; cursor:pointer;" src="img/select_home.png">
            <select style="display:none;" name="concelhos" id="concelhos">
              <option value="">teste</option>
            </select>
          </div>
        </td>
        <td valign="top">
          <div class="input_home_pequisa">Escolha uma categoria 
            <img id="botao_categoria" style="float:right; margin-top:4px; cursor:pointer;" src="img/select_home.png">
            <select style="display:none;" name="categoria" id="categoria">
              <option value="">teste</option>
            </select>
          </div>
        </td>
        <td valign="top">
          <div style="margin-top:-5px;">
            <a href="#" class="botao_home_pesquisa"><i class="ico i-search"></i></a>
          </div>
        </td>
    </tr>
</table>
    
asked by anonymous 13.05.2015 / 00:29

1 answer

0

You can do this by looking for div-parent and then its select : 

$(".input_home_pequisa img").on("click", function(){
   $(this).closest('div').find('select').show();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><tableborder="0" cellspacing="0" cellpadding="0">
    <tr>
        <td valign="top">
          <div class="input_home_pequisa">Escolha um distrito 
            <img id="botao_distritos" style="float:right; cursor:pointer; margin-top:4px;" src="https://project-firefly.com/sites/all/themes/project_firefly_2_0/img/header-submit-button.png"><selectstyle="display:none;" name="teste" id="teste">
              <option value="">teste</option>
            </select>
          </div>
        </td>
        <td valign="top">
          <div class="input_home_pequisa">Escolha um concelho 
            <img id="botao_concelhos" style="float:right; margin-top:4px; cursor:pointer;" src="https://project-firefly.com/sites/all/themes/project_firefly_2_0/img/header-submit-button.png"><selectstyle="display:none;" name="concelhos" id="concelhos">
              <option value="">teste</option>
            </select>
          </div>
        </td>
        <td valign="top">
          <div class="input_home_pequisa">Escolha uma categoria 
            <img id="botao_categoria" style="float:right; margin-top:4px; cursor:pointer;" src="https://project-firefly.com/sites/all/themes/project_firefly_2_0/img/header-submit-button.png"><selectstyle="display:none;" name="categoria" id="categoria">
              <option value="">teste</option>
            </select>
          </div>
        </td>
        <td valign="top">
          <div style="margin-top:-5px;">
            <a href="#" class="botao_home_pesquisa"><i class="ico i-search"></i></a>
          </div>
        </td>
    </tr>
</table>
    
11.11.2017 / 04:40
Enlarge ImageView Android image Mark text with JavaScript