i could not get the data in my showdata div - ajax

Question

I want the list all the details from tow tables using single id without refreshing the Page using Ajax
This is my button and div:-
<button id="brand" data-b_id="21">brand</button>
<div id="#showdata"></div>##
This is my javascript:-
$('#brand').click(function() {
show_product();
function show_product() {
var b_id = $('#brand').data('b_id');
//alert(bid);
$.ajax({
type: 'POST',
url: '<?php echo base_url('index.php/Airtel/get_bdid')?>',
dataType: 'JSON',
data: {
b_id: b_id
},
success: function(data) {
var html = '';
var i;
for (i = 0; i < data; i++) {
html += '<tr>' +
'<td>' + data[i].b_name + '</td>' +
'<td>' + data[i].d_name + '</td>' +
'<td>' + data[i].d_id + '</td>';
};
$('#showdata').html(html);
}
});
}
});
This is my controller:-
public function get_bdid(){
$b_id=$this->input->post('b_id');
$data=$this->mymod->get_bdid($b_id);
echo json_encode($data);
}
This is my model:-
public function get_bdid($b_id){
$this->db->where('b_id',$b_id);
$this->db->select('*');
$this->db->from('brand');
$this->db->join('dth', 'dth.b_name = brand.b_name');
$query = $this->db->get();
return $query->result();
}

Answer 1

Perhaps, there are many errors in browser developer mode.
plz Check your javascript
success: function(data) {
console.log(data);
}
"get_bdid" controller is retrun "json" data type
success: function(data) {
var obj = JSON.parse(data);
console.log(obj);
// or loop
}