user6924814 user6924814 - 1 year ago 79
CSS Question

Onclick open and close div error

I am creating a web services which generates array. I want div open and close on this. I have a div which is on clicking should open another div but in my case when i load my page all divs are opened by default. All i want div to be remained close only on clicking it should open. I want on click of

class="innr-spl3 kmore"
ul class="details"
to be opened and again on clicking it should close.


<?php if(count($json['resultList']) > 0): ?>
foreach ($json['resultList'] as $key=>$value) {
if($json["resultList"][$key]["interestRateMin"] == $json["resultList"][$key]["interestRateMax"]){
$interest = $json["resultList"][$key]["interestRateMin"];
$interest = $json["resultList"][$key]["interestRateMin"].' - '.$json["resultList"][$key]["interestRateMax"];


if($json["resultList"][$key]["financingPercentageMin"] == $json["resultList"][$key]["financingPercentageMax"]){
$financing = $json["resultList"][$key]["financingPercentageMin"];
$financing = $json["resultList"][$key]["financingPercentageMin"].' - '.$json["resultList"][$key]["financingPercentageMax"];


echo '
<div class="cr-content">
<div class="bank-rates">
<div class="innr-spl" style="padding: 5px 0;">
<span style="display:block;"><img src="'.$json["resultList"][$key]["imageUrl"].'"></span>
<span class="hide">'.$json["resultList"][$key]["bankName"].'</span>

<li><div class="innr-spl2">' . $interest . '%' . '</div></li>
<li><div class="innr-spl2">' . $financing . '</div></li>
<li class="hide"><div class="innr-spl3 kmore" id="'.$key.'"><i class="fa fa-chevron-circle-down" aria-hidden="true"></i>View Datails</div> </li>
<div style="clear:both"></div>

<ul class="details" id="ban_'.$key.'">
<li><i class="fa fa-thumbs-o-up" aria-hidden="true"></i> Maximum Loan Amount : '.$json["resultList"][$key]["maxLoanAmt"].'</li>
<li><i class="fa fa-thumbs-o-up" aria-hidden="true"></i> Max Tenure (In Years) : '.$json["resultList"][$key]["repaymentTenureInYears"].'</li>
<li><i class="fa fa-thumbs-o-up" aria-hidden="true"></i> Interest Rate Type : '.$json["resultList"][$key]["rateType"].'</li>



<?php endif;?>



var name =;
$("#ban_" + name).slideToggle("fast");


Answer Source

Two things needed in your case:-

  1. <ul class="details" id="ban_'.$key.'" style = "display:none;">

  2. var name = $(this).attr('id'); // use attr()

Note:- rest of the code seems fine to me.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download