getting checkboxes value using jquery

I'm trying to display to all checked checkboxes into an ID element using jQuery.

I'm able to display all that's checked except that's there's always an error at the end or if nothing is checked

 [object HTMLInputElement]

here's my checkboxes

<input type="checkbox" value="Basketball" name="sport[]" id="sport" placeholder="" class="hazard"/>
<input type="checkbox" value="Volleyball" name="sport[]" id="sport" placeholder="" class="hazard"/>
<input type="checkbox" value="Golf" name="sport[]" id="sport" placeholder="" class="hazard"/>

my submit button (multipage, non-refresh, reason why name is next)

<input type="button" name="next" class="next part2" value="Next" />

my jQuery

$('.part2').click(function(){
  $('.hazard:checkbox:checked').each(function(){
     laro = $(this).val() + ', ' + laro;
  });
});

And the result is fetched via

$("#viewsports").val(laro);

Sample result is,

Basketball, [object HTMLInputElement]

All help would be greatly appreciated.

BB