Can't select and hide any previous element in any shape or form

[clem_c_rock]

I’m about lose my mind with this problem. No form of jQuery selector seems to work in dynamically finding any elements above the link. I’m trying to access an element above the link and hide it. Using things like parent(), prev(), before(), closest(), ect. will show a non-null object but it won’t respond to the hide() method.

<div class="row">
	<div class="col-xs-5">
		<div id="test_fields">
			<li id="test_input" class="string input optional stringish">
				<label class="label" for="test_input">Ingredient name</label>
				<input type="text" name="test_input" value="afsfasf" id="test_input">
			</li>
     </div>
     <input type="hidden" id="recipe_recipe_ingredients_attributes_0__destroy" name="recipe[recipe_ingredients_attributes][0][_destroy]" value="1">
		 <a href="javascript:void(0)" id="test_link" css_class="small" onclick="javascript:remove_fields(this)">Remove Ingredient</a>
   </div>
</div>

function remove_fields(link) {
  $(link).prev("input[type=hidden]").val('1'); // this doesn't work
  
  var div_to_hide = $(link).prev('div');
  
  $(divToHide).hide() // this doesn't work
  //$('#test_fields').hide(); //this works
}