Get first hidden form and show it

Question

I can't figure out how to get first div with class form-wrapper which is hidden and unhide it. What I want to accomplish is to create a button (Add Language) and when this button is clicked, show the first hidden div with class form-wrapper

What I've done: (the function unhideOneForm is called just once, for now, it's for testing purposes, but it does not show any form/div.

function unhideOneForm(){
    $(".form-wrapper :hidden:first").slideToggle("fast");
}
$(document).ready(function(){
    var divs = $('.form-wrapper');
    $.each(divs, function(div){
        //alert($(this).html());
        if ($(this).find('select option:selected').text().indexOf("----") >= 0){

            $(this).hide()
        }
    });
    unhideOneForm()
});

Could you check where is the problem?

Answer 1

The display : none is on your <div class="form-wrapper"> and not its children.

So the selector should be,

$(".form-wrapper:hidden:first")
              //^ - remove the space - it is for child selector.