code is here I am trying to make the Parent element visible when the

Question

0

Asked: May 27, 20262026-05-27T20:05:41+00:00 2026-05-27T20:05:41+00:00

code is here I am trying to make the Parent element visible when the

0

code is here I am trying to make the Parent element visible when the child element gets the style="display:block;", I have tried here but I couldn’t do it
my code is here:

<br/><br/><br/>
<div id="error_message_div">
    <div id="error_message_inner_div">
    <p class="color_red" id="name_error_message">please enter your name</p>
    <p class="color_red" id="email_error_message">please enter your email address</p>
    </div>
</div>
<div id="success_message">Thank you!</div>
<form id="form1">
    <br/><br/>
    Name : <input type="text" id="name" placeholder="enter your name" /><br/><br/>
    E-id : <input type="text" id="email_id" placeholder="enter your email_address" /><br/><br/>
    <input type="button" value="submit" id="form_submit" />
</form>

my css is:

.color_red{color:#f00;font-weight:bold;}
#error_message_div{width:400px;padding: 2px 12px 3px 7px;border: 1px solid #f00;-moz-box-shadow: 1px 1px 4px #ccc;-webkit-box-shadow: 1px 1px 4px #ccc;box-shadow: 1px 1px 4px #ccc;
-webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;-moz-border-radius-topleft: 5px;-moz-border-radius-topright: 5px;border-top-left-radius: 5px;border-top-right-radius: 5px;padding: 10px;background: white;-webkit-box-shadow: inset 0 0 20px #f00,1px 1px 4px #fff;-moz-box-shadow: inset 0 0 20px #f00,1px 1px 4px #fff;box-shadow: inset 0 0 20px #f00,1px 1px 4px #fff;color: black;right: 0;top: 0;}#error_message_inner_div{padding:15px;background:#fff;}#success_message,#name_error_message,#email_error_message{display:none;}#success_message{width:400px;border: 1px solid #00A300;-moz-box-shadow: 1px 1px 4px #ccc;-webkit-box-shadow: 1px 1px 4px #ccc;box-shadow: 1px 1px 4px #ccc;-webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;-moz-border-radius-topright: 5px;border-top-left-radius: 5px;border-top-right-radius: 5px;padding: 10px;background: white;-webkit-box-shadow: inset 0 0 20px #00A300,1px 1px 4px #fff;-moz-box-shadow: inset 0 0 20px #00A300,1px 1px 4px #fff;
box-shadow: inset 0 0 20px #00A300,1px 1px 4px #fff;}

my script is :

$('#form_submit').click(function() {
    var name = $('input#name').val();
    var email = $('input#email_id').val();
    if (name == '') {
        $('#name_error_message').show();
        return false;
    }
    if (email == '') {
        $('#email_error_message').show();
        return false;
    }
    else {
        $('#name_error_message,#email_error_message,#error_message_div').hide();
        $('#success_message').show();
        return false;
    }

});