Show/Hide data when checkbox is ticked and data string matches JQUERY

So here's my issue, I'm trying to include a facility where by in a search field if you check a checkbox it needs to remove any items which have data-isletagreed == 3 against them.

                @if (prop.isLetAgreed == 0)
                {
                    <span class="LetAgreed">
                        <p>FOR&nbsp;&nbsp;SALE</p>
                    </span>
                }
                @if (prop.isLetAgreed == 3)
                {
                    <span class="LetAgreed" style="left:20px;">
                        <p>NOW&nbsp;&nbsp;SOLD&nbsp;SSTC</p>
                    </span>
                }
                @if (prop.isLetAgreed == 2)
                {
                    <span class="LetAgreed">
                        <p>NOW&nbsp;&nbsp;SOLD</p>
                    </span>
                }
                <div class="portfolio-hover">
                    <div class="portfolio-hover-content">
                        <i class="fa fa-eye fa-3x"></i>
                    </div>
                </div>
                <img src="@prop.photo" class="img-responsive" alt="">
            </a>
            <div class="portfolio-caption">
                <h4>@Html.Raw(propertyNameNew)</h4>
                <div class="property-features">
                    <span><i class="fa fa-gbp"></i> @prop.price </span>
                    <span><i class="fa fa-bed"></i> @prop.maxtenants</span>

                </div>
            </div>

        </div>

    }
}

}

This is my current search form, what should I add to make the search button take into account the prop.isLetAgreed == 3 and if a checkbox is checked.

            <div class="row search-input-group">
                <div class="col-md-6">
                    <div class="input-group">
                        <span style="min-width:150px" class="input-group-addon">Bedrooms</span>
                        <div class="dropdown searchRoomWebApi">
                            <button class="btn btn-default dropdown-toggle search-dropdownWebApi" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
                                <span class="txt">select</span>
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu search-dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">select</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">1</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">2</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">3</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">4</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">5</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">6</a></li>
                            </ul>
                        </div>

                    </div>
                </div>
                <div class="col-md-6">
                    <div class="input-group">
                        <span style="min-width:150px" class="input-group-addon">Maximum Price</span>
                        <div class="dropdown searchPriceWebApi">
                            <button class="btn btn-default dropdown-toggle search-dropdownWebApi" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
                                <span class="txt">select</span>
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu search-dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">select</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">£100000</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">£200000</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">£300000</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">£400000</a></li>
                                <li role="presentation"><a role="menuitem" tabindex="-1" href="#">£500000</a></li>
                            </ul>



                        </div>
                    </div>
                </div>

                <div class="col-md-6 col-md-offset-3">
                    <a id="btnSearchPropertyWebApi" style="width:100%" href="#" class="btn btn-default">
                        <span class="glyphicon glyphicon-search"></span> <span class="txt">Search</span>
                    </a>
                </div>

            </div>